JS的超干货笔记（第二弹）

11.浮点数

下面是几种常见的浮点数值：

let floatNumber1 = 2.0;
let floatNumber2 = 0.4;
let floatNumber3 = .2; // 正确，但是不推荐

除此之外还有一些极大或者极小的数值，可以用科学计数法e来表示，例如：

let bigNumber = 9.43e7; // 等于94300000

上面的数值表示 9.43 乘以 10 的 7 次方.

let smallNumber = 3e-7; // 等于0.0000003

上面的数值表示 3 乘以 10 的-7 次方.

浮点数的精度丢失现象

浮点数值的最高精度是 17 位小数，但是在算数运算当中其精度远不如整数.

例如，0.1 加 0.2 的结果不是 0.3：

let number1 = 0.1;
let number2 = 0.2;
console.log(number1 + number2); // 0.30000000000000004

12.NaN

一些出现NaN的情况,如：

1. 0/0

2. 字符串乘以数字

3. NaN和任何数进行运算,例如

13.typeof

.例如：

let a = 'number';
let b = 10;
let c = a / b;
console.log(c); // NaN
console.log(typeof c); // number

上面的代码中typeof是用来判断变量类型的，最后返回的结果number表示是数字类型

14.隐式转换/强制转换

隐式转换：（加法时，数字被隐式转换成字符串；非加法时，都是数字计算）

• 数字字符串加数字,数字隐式转换为字符串

console.log(20 + "20"); // 2020
// 调换位置亦可
console.log("20" + 20); // 2020

其结果不是 40,而是 2020,编译器会将 20 隐式转换为'20',与后面的字符串拼接.

• 数字字符串与数字做非加法运算,字符串隐式转换为数字

console.log("20" - 10); // 10
console.log(10 * "10"); // 100
console.log(10 / "2"); // 5

进行减法运算的时候,'20'会默认转换为 20,然后再进行运算

• 数字字符串与数字字符串做非加法运算,隐式转换为数字

console.log("20" - "10"); // 10
console.log("20" / "10"); // 2
console.log("20" * "10"); // 200

强制转换：

强制类型转换我们需要学习两个,parseInt(将小数字符串、整数字符串或者小数转换为整数)、parseFloat(将小数字符串转换为小数).

parseInt

• 整数字符串转换为整数

let number = "20";
//  将number转换为整数类型
let converNumber = parseInt(number);
console.log(converNumber); // 20
// 判断转换后的数据类型
console.log(typeof converNumber); // number

• 小数字符串转换为整数

let number = "20.5";
let converNumber = parseInt(number);
console.log(converNumber); // 20  不足21一律按照20算
console.log(typeof converNumber); // number

• 小数转换为整数

let number = 20.5;
let converNumber = parseInt(number);
console.log(converNumber); // 20

parseFloat

将小数字符串转换为小数

let number = "20.9";
let converNumber = parseFloat(number);
console.log(converNumber); // 20.9
console.log(typeof converNumber); // number

15.字符串拼接

• 字符串拼接使用的符号是+(加号)

• 字符串用引号引起来,单双引不做要求,但是要对应,不能是前半部分单引号,后半部分双引号,如('").

• 变量名不能用引号,如果变量名在字符串中间,可以用加号和引号区分开,例如("我的名字："+name+",谢谢").

16.运算符

相等/全等：（判断类型用== ，判断值用===）

1. == 会先做数据类型转换，再比较

2. === 不会做数据类型转换

   自增/自减：

let balloon = 10;
let money = 0;
​
balloon--;
money++;
console.log("第一次递减后的结果：" + balloon);
console.log("第一次递增后的结果：" + money);
​
balloon--;
money++;
console.log("第二次递减后的结果：" + balloon);
console.log("第二次递增后的结果：" + money);

逻辑或(||)/逻辑与(&&)

逻辑或

逻辑或类似于电路中的并联电路,如下图所示：

两个开关中只要有一个开关关闭,灯就会亮. 我们可以认为开关关闭就是true,开关打开就是false, 灯亮表示最后的结果是true,灯灭表示最后结果为false.

可以总结为一句话,一真即真,都假即为假.

下面我们将电路转换为代码：

let switch1 = true; // 表示开关1是闭合的
let switch2 = false; // 表示开关2是打开的
​
let result = switch1 || switch2; // 如果结果是true,就表示灯亮
console.log(result);

逻辑与

逻辑与类似于电路中的串联电路,如下图所示：

两个开关必须都关闭,灯才会亮.

将电路转换为代码：

let switch1 = true; // 表示开关1是闭合的
let switch2 = false; // 表示开关2是打开的
​
let result = switch1 && switch2; // 如果结果是false,就表示灯灭
console.log(result);

17.布尔类型

布尔类型数据简单来说就是true(真)和false(假),

另外再介绍两种不需要通过运算符就能得到布尔类型数据的,如下表所示：

数据类型	转换为true的值	转换为false的值
字符串	任何非空字符串	""(空字符串)
数字	任何非零数字	0

18.if 的格式

if

if (条件) {
  // 待执行代码
}

这段代码中,括号()里面的是“条件”,大括号{}里面的是要执行的代码,整个代码的意思就是,如果()里面的条件为true,那么就执行{}里面的代码,否则不执行.

if-else-if

let myAge = 17;
​
if (myAge < 16) {
  console.log('你还是未成年人');
} else if (myAge >= 16 && myAge < 18) {
  console.log('你是完全能力人');
} else {
  console.log('你是成年人');
}

else if可以理解为第二个if,方便我们添加第二种或者第三种条件,括号()里面添加的是附加条件.

switch

switch语句可以说是if else if的变异体,我们先用switch将根据天气决定要做什么的案例修改一下：

let weather = 'rain';
​
switch (weather) {
  case 'snow':
    console.log('堆雪人');
    break;
  case 'windy':
    console.log('呆在家里');
    break;
  case 'rain':
    console.log('雨中漫步');
    break;
  default:
    console.log('工作');
    break;
}

default你可以理解为else,就是当上面所有的case中都不包含weather值,那么就会执行default后面的代码

代码中的break就是打断的意思,表示跳出switch

19.数组

在JavaScript中,数组的表示方法是一个方括号([]),例如：

[]

你可以将上面的代码中的[]理解为一个空数组

另一种创建数组的方式,比如：

// 创建一个空数组并赋值
let arr = new Array();
​
// 创建一个有内容的数组
let arr2 = new Array(1,2,'arr');

数组的索引

根据索引(下标)取出数组中对应的值

// 定义数组
let arr = ['张三','李四','王五','Lisa'];
// 定义一个变量来接收取到的值
let str = arr[2];
// 输出取到的值
console.log(str); // 王五

数组索引(下标)可以用来修改对应位置的值

let arr = ['张三','李四','王五','Lisa'];
// 修改'王五'为'Tom'
arr[2] = 'Tom';
// 输出数组
console.log(arr);

数组索引(下标)可以在新的位置上插入值

let arr = ['张三','李四','王五','Lisa'];
​
// 修改值
arr[0] = 'Three';
arr[1] = 'Four';
arr[2] = 'Five';
arr[3] = '丽莎';
console.log(arr);
​
// 添加值
arr[4] = 'Polly';
​
console.log(arr);

从上面的例子可以看出,在已有索引上执行arr[x] = 'XXX',是修改操作,如果是在未有的位置上执行arr[x] = 'XXX'操作,是添加操作.

20.数组元素操作(增/ 删/改/查）

1.push (从尾加)

2.unshift (从头加)

3.pop (从后往前删除)

4.shift (从前往后删除)

5.splice (删除指定位置的值)

一个参数

表示删除从指定位置开始到结束位置的所有元素,并返回被删除的元素

let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];
​
// 删除从下标为1的位置到结束位置的值
let deleteSchools = schools.splice(1);
// 删除之后，原数组中的剩余内容
console.log(schools); // ["清华大学"]
// 删除的内容
console.log(deleteSchools); // ["北京大学", "浙江大学", "同济大学"]

两个参数

let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];
​
// 从下标为0开始,往后数两个元素,删除
let deleteSchools = schools.splice(0, 2);
console.log(schools); // ['浙江大学', '同济大学']
console.log(deleteSchools); // ['清华大学', '北京大学']

6.splice (改指定位置的元素)

1. 第一个值,整数类型,表示起始位置

2. 第二个值,整数类型,表示步长(往后选几个元素,1 代表往后选 1 个元素)

3. 第三个参数,要替换的数组的值

   let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];
   ​
   schools.splice(2, 0, '江西理工大学');
   console.log(schools); //  ["清华大学", "北京大学", "江西理工大学", "浙江大学", "同济大学"]

   在这个案例中,splice方法的第一个参数是 2,第二个参数是 0,也就是从下标 2 开始,往后走 0 个步长,然后用"江西理工大学"替换这 0 个步长里的内容.

4. let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];
   ​
   schools.splice(2, 1, '江西理工大学');
   console.log(schools); // ["清华大学", "北京大学", "江西理工大学", "同济大学"]

   当步长为 1 以后,从 2 开始,往后走 1,就选中了"浙江大学",然后用“江西理工大学”替换了“浙江大学”.

let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];
​
schools.splice(2, 2, '江西理工大学');
console.log(schools); // ["清华大学", "北京大学", "江西理工大学"]

这个案例中步长为 2,开始位置为 2,这样就选中了“浙江大学”和“同济大学”,然后将这两个大学用“江西理工大学”替换

7.indexOf (查)

一个参数

比如说我们要查询schools数组内是否有某个学校：

let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];
​
let result = schools.indexOf('大连理工');
console.log(result); // -1

返回值是-1表示未找到,非-1数字表示找到的元素的下标

两个参数

第一个参数是我们要找的值,第二个参数是开始寻找的位置,比如在一个参数的情况下我们来寻找"浙江大学".

let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];
​
let result = schools.indexOf('浙江大学');
console.log(result); // 2 表示“浙江大学”所在的下标为2

结果是 2，表示找到了。但是当使用第二个参数规定开始寻找的位置，就未必能找到了。例如：

let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];
​
let result = schools.indexOf('浙江大学', 3);
console.log(result); // -1

因为我们是从下标为 3 的位置（同济大学）开始寻找的，所以找不到。

所以，使用第二个参数的时候，一定要小心哦。