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的情况,如：

0/0
字符串乘以数字
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.运算符

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

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

自增/自减：

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 (条件) {// 待执行代码
}

这段代码中,括号()里面的是“条件”,大括号{}里面的是要执行的代码,整个代码的意思就是,如果()里面的条件为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 代表往后选 1 个元素)

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

let schools = ['清华大学', '北京大学', '浙江大学', '同济大学'];

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

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

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 的位置（同济大学）开始寻找的，所以找不到。

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

JS的超干货笔记（第二弹）相关推荐

vue如何获取年月日_vue 学习笔记第二弹
1. vue,学习第二弹! 1.x 版本中的 filterBy 指令,在2.x中已经被废除: filterBy - 指令 1 在 2.x 版本中手动实现筛选的方式: 筛选框绑定到 VM 实例中的 se ...
王小草【深度学习】笔记第二弹--细说卷积神经网络
欢迎关注本人微信公众号:王小草之大数据人工智能.不定期分享学习笔记. 欢迎关注本人喜马拉雅账号:好吧我真的叫王草.不定期更新各类有声书与文章,涉及诗歌,自传日志,科技IT新书等. 恩,对,一名励志要做 ...
LaTex学习笔记第二弹——罗列应用
目录什么是罗列常规罗列排列罗列解说罗列什么是罗列罗列就是将论述的内容按一定的顺序一条一条的排列,罗列在论文写作中经常用到. 罗列所使用的宏包主要有以下几个: \usepackage{par ...
JS学习笔记——基础第二弹
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
学习javascript这一篇就够了超详细笔记（建议收藏）上
学习javascript这一篇就够了超详细笔记(建议收藏)上 1.初识计算机基础导读编程语言计算机基础初识js 浏览器执行 js组成 js初体验-三种书写位置 js注释 js输入输出语句 2. ...
2023年春节祝福第二弹——送你一只守护兔，让它温暖每一个你【html5 css3】画会动的小兔子，炫酷充电，字体特效
2023年春节祝福第二弹送你一只守护兔,让它温暖每一个你! [html5 css3]画一只会动的兔子目录一.送你一只守护兔,效果图二.前言三.代码解释及部分特效教程 (1).css3 立体字 ...
css+js+jq实训笔记
css+js+jq实训笔记 css第一天 css第二天 css第三天 css第四天 css第五天 css第六天 js第一天 js第二天 js第三天 js第四天 js第五天 js第六天 jq第一天 jq ...
CSS 动画相关属性动态实例大全（82种），2023年祝福第二弹（送你一只守护兔）(下），守护兔源代码免费下载
2023年春节祝福第二弹--送你一只守护兔(下) CSS 动画相关属性动态实例大全(82种).守护兔源代码免费下载本文目录: 五.CSS3 动画相关属性实例大全 (1).CSS3的动画基本属性 (2 ...
Java并发编程（中下篇）从入门到深入超详细笔记
接上一篇博客笔记:Java并发编程(中上篇)从入门到深入超详细笔记_未来很长,别只看眼前的博客-CSDN博客https://blog.csdn.net/weixin_53142722/article ...

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

JS的超干货笔记（第二弹）相关推荐

最新文章

热门文章