JavaScript——基础语法（数据类型以及转换、操作符）

一、数据类型

1·1 为什么需要数据类型？

• 在计算机中，不同的数据所需占用的存储空间是不同的，为了便于把数据分成所需内存大小不同的数据，充分利用存储空间，于是定义了不同的数据类型。
• JavaScript是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型，
  在程序运行过程中，类型会被自动确定。
  在代码运行时，变量的数据类型是由JS引擎根据=右边变量值的数据类型来判断的，运行完毕之后，变量就确定了数据类型。JavaScript拥有动态类型，同时也意味着相同的变量可用作不同的类型。

1·2 数据类型之简单数据类型

1·2·1 数字型Number

数字类型既可以用来保存整数值，也可以保存小数（浮点数）

注意：

• 数字型进制：最常见的进制有二进制、八进制、十进制、十六进制；在JS中八进制前面加0，十六进制前面加0x。例如：
  var 010；//输出等于8；（八进制）
  var 0x9；//输出等于9；（十六进制）
• 数字型范围：数值的最大和最小值；（一般不用）例如：
  console.log(Number.MAX_VALUE);值等于：1.7976931348623157e+308
  console.log(Number.MIN_VALUE);值等于：5e-324
• 数字型三个特殊值：
  1、Infinity,代表无穷大，大于任何数值
  2、-Infinity,代表无穷小，小于任何数值
  3、NaN(Not a number)代表一个非数值
• isNaN(x):用来判断一个变量是否为非数字的类型，返回true或者false.例如：
  console.log(isNaN(12)); //false
  console.log(isNan('pink老师')); //true

1·2·2 字符串类型

字符串型可以是引号中的任意文本，其语法为双引号“”和单引号‘’
因为HTML标签里面的属性使用的是双引号，JS这里我们更推荐使用单引号。

注意：

• JS可以用单引号嵌套双引号，或者用双引号嵌套单引号（外双内单，外单内双）例如：
  var str = '我是一个"高富帅"的程序员';
  console.log(str);
  var str = "我是一个'高富帅'的程序员";
  console.log(str);
• 字符串转义符：类似HTML里面的特殊字符，字符串中也有特殊字符，我们称之为转义符。转义符都是\开头的，常用的转义符及其说明如下：
  1、\n（换行符，n是newline的意思）
  2、\\（斜杠\）
  3、\'(‘单引号)
  4、\“（”双引号）
  5、\t(tab缩进)
  6、\b(空格，b是blank的意思)
• 字符串长度：字符串是由若干字符组成的，这些字符的数量就是字符串的长度。通过字符串的length属性可以获取整个字符串的长度。例如：
  var str = 'my name is andy';
  console.log(str.length);//输出为15
• 字符串拼接：多个字符串之间可以使用+进行拼接，其拼接方式为字符串+任何类型=拼接之后的新字符串；拼接前会把与字符串相加的任何类型转成字符串，再拼接成一个新的字符串； 例如：
  console.log('沙漠' + '骆驼');//沙漠骆驼
  console.log('pink' + 18);//
  console.log('pink' + true);//pinktrue
  console.log(12 + 12);//24
  console.log('12' + 12);//1212
   

1·2·3 布尔值类型

布尔类型有两个值：true和false，其中true表示真（对），而false表示假（错）。
布尔型和数字型相加的时候，true的值为1，false的值为0。

例如：
console.log(true + 1);//等于2
console.log(false + 1);//等于1

1·2·4 Undefined

一个声明没有被赋值的变量会有一个默认值undefined（如果进行相连或者相加时，注意结果）

例如：
var str;
console.log(str);//输出undefined
var varible = undefined;
console.log(varible + 'pink');
//输出undefinedpink
console.log(varible + 1); //输出NaN

1·2·5 Null

一个声明变量给null值，里面存的值为空。

例如：
var space = null;
console.log(space + 'pink'); 
//输出nullpink
console.log(space + 1); //输出1

1·3数据类型的转换

数据类型的转换：使用表单、prompt获取过来的数据默认是字符串类型的，此时就不能直接简单的进行加法运算，而需要转换变量的数据类型。通俗来说，就是把一种数据类型的变量转换成另外一种数据类型。

通常会实现3种方式的转换：
1、转换为字符串类型
2、转换为数字型
3、转换为布尔型

1·3·1 转换为字符串类型

方式、说明、案例
1、变量名.toString();转成字符串
案例：
 var num = 10;
 var str = num.toString();
2、String()强制转换;转换成字符串
案例：
console.log(String(num));
3、加号拼接字符串；和字符串拼接的结果都是字符串
案例：
console.log(num + ''); 

注意：

• toString()和String()使用方式不一样。

1·3·2 转换为数字型

方式、说明、案例
1、parselnt(string)函数；将string类型转换成整数数值型（重点）
案例：
console.log(parseInt('3.14'));//输出3 取整数
console.log(parseInt('3.96')); //输出3
console.log(parseInt('120px')); //120 会去掉px单位
console.log(parseInt('rem120px')); //输出NaN

2、parseFloat(string)函数；将string类型转换成浮点数数值型（重点）
案例：
console.log(parseFloat('3.14'));//输出3.14
console.log(parseFloat('120px'));//输出120

3、Number()强制转换函数；将string类型转换成数值型
案例：
var str = '123';
console.log(Number(str));
console.log(Number('12'));

4、js隐式转换（- * /）；利用算术运算隐式转换为数值型
案例：
console.log('12' - 0);
console.log('123' - '120');
console.log('123' * 1);

注意：

1. parseInt和parseFloat单词的大小写
2. 隐式转换是我们在进行算数运算的时候，JS自动转换了数据类型。

1·3·3 转换为布尔型

方式、说明、案例
1、Boolean()函数；其他类型转换成布尔值。
案例：
console.log(Boolean('')); //false
console.log(Boolean(0)); //false
console.log(Boolean(NaN)); //false
console.log(Boolean(null)); //false
console.log(Boolean(undefined)); //false
console.log(Boolean('123')); //true
console.log(Boolean('你好吗')); //true
console.log(Boolean('我很好')); //true

注意：

1. 代表空、否定的值会被转换为false，如 ''、0、NaN、null、undefined
2. 其余值都会被转换为true

二、操作符

运算符也被称为操作符，是用于实现赋值、比较和执行算术运算等功能的符号。

JavaScript中常用的运算符有：
1】算数运算符
2】递增和递减运算符
3】比较运算符
4】逻辑运算符
5】赋值运算符

2·1 算术运算符

概念：算术运算使用的符号，用于执行两个变量或值的算术运算。
运算符、描述、实例：
1】+；加；10+20=30
2】- ；减；10-20=-10
3】* ；乘；10*20=200
4】/ ；除；10/20=0.5
5】%；取余数（取模）；
返回除法的余数9%2=1

注意：

1. 浮点数的精度问题：浮点数值的最高精度是17位小数，但在进行算术计算时其精确度远远不如整数。
2. 不要直接判断两个浮点数是否相等！

表达式和返回值：
1】表达式：是由数字、运算符、变量等以能求得数值的有意义排列方法所得的组合；
简单理解：是由数字、运算符、变量等组成的式子
2】返回值：表达式最终都会有一个结果，返回给我们，我们成为返回值

2·2 递增和递减运算符

概述：如果需要反复给数字变量添加或减去1，可以使用递增（++）或递减（--）运算符来完成。
在JavaScript中，递增（++）和递减（--）既可以放在变量前面，也可以放在变量后面。放在变量前面时，我们可以称为前置递增（递减）运算符，放在变量后面时，我们可以称为后置递增（递减）运算符。

注意：

• 递增和递减运算符必须和变量配合使用。

递增运算符：

• 前置递增运算符
  ++num前置递增，就是自加1，类似于num=num+1,但是++num写起来更简单。
  使用口诀：先自加，后返回值
• 后置递增运算符
  num++后置递减，就是自z加1，类似num=num+1,但是num++写起来更简单。
  使用口诀：先返回原值，后自加

小结：
1】前置递增和后置递增运算符可以简化代码的编写，让变量的值+1比以前的写法更简单
2】单独使用时，运行结果相同
3】与其他代码联用时，执行结果会不同
4】后置：先原值运算，后自加（先人后己）
5】前置：先自加，后运算（先己后人）
6】开发时，大多使用后置递增/减，并且代码独占一行，例如：num++;或者num--;

2·3 比较运算符

概念：
比较运算符（关系运算符）是两个数据进行比较时所使用的运算符，比较运算后，会返回一个布尔值（true/false）作为比较运算的结果。

 

2·4 逻辑运算符

概念：逻辑运算符是用来进行布尔值运算的运算符，其返回值也是布尔值。后面开发中经常用于多个条件判断。

 注意：

• &&：两边都是true才返回true，否则返回false；
• ||：两边都是false才返回false，否则都为true；
• 逻辑非（!）也叫做取反符，用来取一个布尔值相反的值，如true的相反值是false；

短路运算（逻辑中断）
短路运算的原理：当有多个表达式（值）时，左边的表达式可以确定结果时，就不再继续运算右边的表达式的值。

逻辑与

语法：表达式1&&表达式2；
如果第一个表达式的值为真，则返回表达式2；
如果第一个表达式的值为假，则返回表达式1；
巧记：&&像电路，一真短路，能看到二；一假短路，只看到一。

逻辑或

语法：表达式1||表达式2
如果第一个表达式的值为真，则返回表达式1；
如果第一个表达式的值为假，则返回表达式2；
巧记：||像猜左右手，一有就是一；一没有就是二。

2·5 赋值运算符

概念：用来把数据赋值给变量的运算符。

 例如：
 var num = 10;
 num += 5; //每次自加5
 console.log(num); //输出15
 var age = 5;
 age *= 10; //自乘10
console.log(age); //输出50

2·6 运算优先级

 注意：

1. 一元运算符里面的逻辑非优先级很高
2. 逻辑与比逻辑或优先级高