欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 汽车 > 新车 > JavaScript基础知识之基本语句与数据类型

JavaScript基础知识之基本语句与数据类型

2024/10/24 4:41:47 来源:https://blog.csdn.net/zzx0419_/article/details/140628803  浏览:    关键词:JavaScript基础知识之基本语句与数据类型

JavaScript基础知识之基本语句与数据类型

前言

​ 前端的三板斧,HTML、CSS和JavaScript,前面两个我之前已经学过了,今天开始学JavaScript,嗯,个人觉得还是比较简单的,如果有其他编程语言的基础的话,看文档学习很快就能掌握JavaScript,至少目前我是这样觉得的,也可能是因为我学的不是很深,有很多地方没去学习,我是想着学完JavaScript之后去学vue,所以我就学的比较浅,如果后面学vue的时候遇到看不懂的再去补吧。

JavaScript简介

​ JavaScript 是一种轻量级的脚本语言。所谓“脚本语言”,指的是它不具备开发操作系统的能力,而是只用来编写控制其他大型应用程序 的“脚本”。 JavaScript 是一种嵌入式(embedded)语言。它本身提供的核心语法不算很多,学起来比较容易。

JavaScript与ECMAScript的关系

​ ECMAScript和JavaScript的关系是,前者是后者的规格,后者是前 者的一种实现。在日常场合,这两个词是可以互换的。

JavaScript语句和标识符

语句

​ JavaScript程序的单位是行(line),也就是一行一行地执行,一般情况下,每一行就是一个语句。语句以分号结尾,一个分号就表示一个语句的结束。

标识符

​ 标识符指的是用来识别各种值地合法名称。最常见的标识符就是变量名。

​ 标识符是由字母、美元符号$、下划线和数字组成,其中数字不能开头。

​ 中文也是合法的变量名,不会报错,但是不推荐使用中文。

变量
var num = 10;

​ 变量的重新赋值

var num = 10;
num = 20;
变量提升

​ JavaScript 引擎的工作方式是,先解析代码,获取所有被声明的变 量,然后再一行一行地运行。这造成的结果,就是所有的变量的声 明语句,都会被提升到代码的头部,这就叫做变量提升(hoisting)。下面举个简单的例子。

console.log(num);
var num = 20;

​ 这段代码第一行会在控制台打印20,不会因为赋值语句在打印语句后而出现打印不出来的情况。

JavaScript嵌入到文件中

​ 这里有三种方式来把JavaScript嵌入到文件当中去。

1.嵌入到HTML文件中

 <body><script>var age = 20</script></body>

直接在body标签中写入script标签就可以了。

2.引入本地文件

 <body><script type = "xxxxx " src = "xxxx">var age = 20</script></body>

3.引入网络文件

<body><script src = "xxxx">var age = 20</script></body>

JavaScript的注释与输出语句

//这是单行注释
/*
这是
多行
注释
*/
<!-- 在html文件中的注释 -->
//注释的快捷键ctrl+/

输出语句

// 在浏览器中弹出一个对话框,然后把要输出的内容展示出
//来,alert都是把要输出的内容首先转换为字符串然后在输出
//的
alert("要输出的内容");
//在页面上输出document.write("要输出的内容"); 
// 在控制台输出内容
console.log("要输出的内容")

数据类型

​ JavaScript 语言的每一个值,都属于某一种数据类型。JavaScript 的 数据类型,共有六种。根据类型分类可以分为基本数据类型和符合数据

var age = 20;var s = "html";var a = true;var user = {// age: 20,// name:"zhao",// hunyin:false,}

以上就是几种数据类型,基本数据类型有数值,字符串和布尔类型。符合数据就是对象,内包含多个数据。

还有两种数据类型为null和undefined这两种,这两种一般看为两种特殊值。

运算符

typeof运算符

var age = 20;var s = "html";var a = true;var user = {// age: 20,// name:"zhao",// hunyin:false,};//typeof一般用来判断基本数据类型(object对象有很多)//返回numberconsole.log(typeof age);//返回stringconsole.log(typeof s);//返回booleanconsole.log(typeof a);//返回objectconsole.log(typeof user);//返回objectconsole.log(typeof []);//返回objectconsole.log(typeof null);//返回undefinedconsole.log(typeof undefined);//null和undefined的区别//null表示对象没有,undefined表示数值没有

​ typeof运算符是用来判断数据结构的,一般就是用来判断基本数据类型的,对于复合数据类型即对象,因为有很多都会返回object,所以一般不用这个运算符来进行判断。

算数运算符

​ 算数运算符就是基本的加减乘除等等,非常简单,这里就一笔带过了。

 var num1 = 100;var num2 = 10;//110console.log(num1+num2);//90console.log(num1-num2);//1000console.log(num1*num2);//10console.log(num1/num2);
//自加自减num1++;console.log(num1);num2--console.log(num2);console.log(++num1);console.log(--num2);

​ 需要注意的是,在使用自加自减的时候,就是放在变量之后,会 先返回变量操作前的值,再进行自增/自减操作;放在变量之前,会 先进行自增/自减操作,再返回变量操作后的值。

赋值运算符

//赋值运算//吧20的值赋num3var num3 = 20;//把10的值赋给num4var num4 = 10;//把num4的值赋给num3num3 = num4;//等价于num3 = num3+num4num3+=num4;//等价于num3 = num3-num4num3-=num4;//等价于num3 = num3*num4num3*=num4;//等价于num3 = num3/num4num3/=num4;//等价于num3 = num3%num4num3%=num4;

比较运算符

​ 比较运算符用于比较两个值的大小,然后返回一个布尔值,表示是否满足指定的条件。

​ JavaScript一共提供了8个比较运算符

比较运算符描述
<小于运算符
>大于运算符
<=小于或等于运算符
>=大于或等于运算符
==相等运算符
===严格相等运算符
!=不相等运算符
!==严格不相等运算符
=的区别

比较值而=比较值和类型

布尔运算符

取反运算符(!)
//布尔值的取反
!true//false
!false//true
//非布尔值的取反,对于非布尔值的取反,取反运算符会将其转化为布尔值,为方便记忆,下面6个值取反后为true,其他都为false
!undefined//true
!null//true
!0//true
!NaN//true
!""//true
!false//true
且运算符(&&)

当两个条件都满足时才返回true,否则返回false

console.log(2>1&&3>2);//true
或运算符(||)

当两个条件又一个满足返回true,都不满足返回false

console.log(10>20||10>5;//true

条件语句

if语句

if结构先判断一个表达式的布尔值,然后根据布尔值的真伪,执行不同的语句。所谓布尔值,指的是JavaScript的两个特殊值,true表示真,false表示伪。语法规范如下。

if(布尔表达式){语句;
}
//实例如下
var num = 2;
if(num==2){num++;
}
console.log(num);

​ 需要注意的是,不要混淆比较运算符与赋值运算符,括号里的内容应该是一个布尔值为结果,不要混淆=与==的作用。

if…else语句

​ 在实际应用中,我们可能会遇到根据不同的结果来执行不同的操作,那么此时就可以使用if…else语句来实现。

//实例
var num = 4;
if(num>2){num--;
}else{num++;
}
//这段代码意思为当num大于2时,自减,否则自加。
//当有多个条件时,if else语句可以写多次,例如
if(num==4){num -= 1;
}else if(num==3){num -= 2;
}else if(...){//
}
else{//
}

需要注意的是,当有多个else时,else代码块总是与离自己最近的那个if语句配对。

switch语句

​ 当多个if else连在一起使用的时候,我们可以引入switch语句。

switch (fruit) {case "banana":// ...如果fruit为banana,执行这个语句break;case "apple":// ...如果fruit为apple,执行这个语句break;default:// ..都不是,执行这个语句
}

需要注意的是,每个case代码块内部的break语句不能少,否则会 接下去执行下一个case代码块,而不是跳出switch结构。

三元运算符

三元运算符可以理解为一个if else结构,它的结构如下

(条件)?表达式1:表达式2
//这段代码意思是,当条件为true,执行表达式1,为false执行表达式2
//例子,判断奇数偶数
var n = 100;n % 2 === 0 ? '偶数' : '奇数;

循环语句

for循环

循环语句用于重复执行某个操作,for语句就是循环命令,可以指定循环的起点,循环的终点和终止条件,格式如下。

for(初始化语句 ;条件;迭代因子){
语句
}

for语句后面的括号里面,有三个表达式。

初始化表达式(initialize):确定循环变量的初始值,只在循环 开始时执行一次。

布尔表达式(test):每轮循环开始时,都要执行这个条件表达 式,只有值为真,才继续进行循环。

迭代因子(increment):每轮循环的最后一个操作,通常用来 递增循环变量

var x = 3;for (var i = 0; i < x; i++) {console.log(i);}
//三个表达语句可以全部省略,这样会陷入死循环for ( ; ; ){console.log('Hello World');}

while循环

while循环包括一个循环条件和执行代码块,只要循环条件为真,就会不断执行代码块中的代码。

 while (条件) {
语句;}
//例子var i = 0;while (i < 100) {console.log('i 当前为:' + i);i = i + 1;}

break和continue

​ break语句和continue语句都具有跳转作用,可以让代码不按既有的顺序执行。

break语句用于跳出代码块或循环

 for (var i = 0; i < 5; i++) {if (i === 3){break;}console.log(i);}

​ continue语句用于立即终止本轮循环,返回循环结构的头部,开始下一轮循环

for (var i = 0; i < 5; i++) {if (i === 3){continue;}console.log(i);}

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com