前言
大家好,我是 HoMeTown,web 领域有一本神书大家应该都有看过,这本书我看过两遍,但是每次看都是粗粗的略过一些重要的知识点,甚至一些面试过程中的问题,在这本书里都能找到答案。
工作这么多年,到现在为止对这本书都没有一个系统的知识点记录,这次想从头读一遍这一本 JavaScript 高级程序设计【第 4 版】,并把重要的知识点
记录下来,同时加上自己的见解。
关注专栏,一起学习吧~
操作符
一元操作符
概念:只操作一个值。
递增(++)/递减(--)
前缀版
let age = 29
++age
// 以上代码等价于:
let age = 29
age = age + 1
复制代码
与后缀版不同的是:变量的值会在语句被求值之前改变!
let age = 32
let hisAge = ++age + 1
console.log(age) // 33
console.log(hisAge) // 34
复制代码
后缀版
let age = 32
let hisAge = age++ + 1
console.log(age) // 33
console.log(hisAge) // 33
复制代码
一元加(+)和减(-)
let age = +12
let num = -12
console.log(age) // 12
console.log(num) // -12
复制代码
位操作符
位操作符用于数值的底层操作,ECMAScript 底层以IEEE 754 64位
格式存储,但是操作是将值转化为32位
,再转成64位
。
有符号整数值前31位表示数值
,第32位表示数值的符号:1正,0负
,其中正值以真正的2进制
存储:
比如18的2进制:00000000000000000000000000010010,精简版:10010(5个有效位)。
18/2 = 9 余0 //0
9/2 = 4 余 1 //1
4/2=2 余0 //0
2/2=1 余0 //0
1/2=0 余1 //1
得:10010
反过来算:2**0*0 + 2**1*1 + 2**2*0 + 2**3*0 + 2**4*0 = 18
:0 + 2 + 0 + 0 + 16 = 18
复制代码
而负数需要进行一个补码
操作,一个数值的补码
通过如下 3 个步骤:
决定绝度值的二进制数。
反码(也就是把每个 0 变成 1,把每个 1 变成 0)
给结果+1。
比如-18的2进制:11111111111111111111111111101110。
1. 确定18的2进制:00000000000000000000000000010010
2. 反码:11111111111111111111111111101101
3. 结果+1:11111111111111111111111111101110
复制代码
其实 ECMAScript 会帮我们记录这些值,把一个负数值转成一个 2 进制字符串时,会得到一个加了减号的绝对值:
let num = -18
num.toString(2) // -10010
复制代码
按位非
~
,返回数值的反码:
let num1 = 25 // 二进制 00000000000000000000000000011001
let num2 = ~num1 // 二进制数 11111111111111111111111111100110
console.log(num2) // -26
复制代码
~
按位非因为只取到了反码,所以会在结果上-1,如果需要得到对应的负数值,需要再+1.
按位与
&
,将两个数的每一个位对其,基于与规则(1&1=1;1&0=0;0&1=0;0&0=0),对每一位执行相应的与操作(只要有一位是 0,那么就返回 0):
let result = 25 & 3
console.log(result) // 1
---
25 // 11001
3 // 00011
1 // 00001
复制代码
按位或
|
,与按位与类似,但是你只要一个位是 1,那么就返回 1:
let result = 25 & 3
console.log(result) // 27
---
25 // 11001
3 // 00011
27 // 11011
2**0*1 + 2**1*1 + 2**2*0 + 2**3*1 + 2**4*1 = 27
1 + 2 + 0 + 8 + 16 = 27
复制代码
按位异或
^
,只有一位是 1,返回 1,两位都是 1 或者两位都是 0,返回 0
let result = 25 & 3
console.log(result) // 27
---
25 // 11001
3 // 00011
26 // 11010
2**0*0 + 2**1*1 + 2**2*0 + 2**3*1 + 2**4*1 = 26
0 + 2 + 0 + 8 + 16 = 26
复制代码
左移
<<
,把 2 进制数往左移动 n 位,空位补 0:
let oldVal = 2 // 00010
let newVal = oldVal << 5 // 1000000
console.log(newVal) // 2*6*1 64
复制代码
右移
>>
,把 2 进制数往右移动 n 位,空位补 0。
布尔操作符
逻辑与
&&
1 2 r
t t t
t f t
f t f
f f f
复制代码
逻辑与是一种短路操作符
,如果第一个操作数决定了结果,第二个就不再求值:
true && name // 报错
false && name // 不报错
复制代码
逻辑或
||
1 2 r
t t t
t f t
f t t
f f f
复制代码
逻辑或也是一种短路操作符
,如果第一个操作数是 true,第二个就不再求值:
true || obj // 不报错
false || obj // 报错
复制代码
逻辑非
!
console.log(!false); // true
console.log(!"blue"); // false
console.log(!0); // true
console.log(!NaN); // true
console.log(!""); // true
console.log(!12345); // false
------
console.log(!!"blue"); // true
console.log(!!0); // false
console.log(!!NaN); // false
console.log(!!""); // false
console.log(!!12345); // true
复制代码
乘性操作符
乘法
*
除法
/
取余
%
指数操作符
**
2 ** 2 // 4
let num = 2
num **= 3 // 8
复制代码
条件操作符
xx ? yyy : ddd
语句
if
流程控制语句
if (condition) statemert1 else statement2
do-while
后测试循环语句,循环体中的代码至少执行一次
:
do { statement } while (expression)
复制代码
let i = 0;
do {
i += 1
} while( i < 10 )
复制代码
while
先测试循环语句,循环体中的代码可能一次都不会执行
:
while(expression) statement
复制代码
let i = 0;
while(i<10){
i += 2
}
复制代码
for
先测试循环语句:
for( initialization; expression; post-loop-expression) statement
复制代码
for(let i = 0; i < count; i++) {
console.log(i)
}
复制代码
执行的顺序为:initialization -- > expression? statement : exit() ;post-loop-expression;expression? statement : exit() ;post-loop-expression;.......
for-in
严格的迭代语句,用于枚举对象中的非符号(Symbol)键属性:
for(const propName in window) {
console.log(propName)
}
复制代码
ECMAScript 中对象的属性是无序的
,因此for-in
语句不能保证返回对象属性的顺序
(每个可枚举的属性都会返回,但是顺序可能会因浏览器而异)。
for-of
严格的迭代语句,用于遍历可迭代对象的元素:
for(const el of [2,4,5,6]) {
console.log(el)
}
复制代码
break 和 continue
break 语句用于立即退出循环,强制执行循环后的下一条语句,也就是直接退出循环
。
let num = 0
for (let i = 1; i < 10; i++) {
if(i%5 === 0) {
break;
}
num++
}
console.log(num) // 4
复制代码
continue 语句用于立即退出循环,再次从循环顶部开始执行
。
let num = 0
for (let i = 1; i < 10; i++) {
if(i%5 === 0) {
continue;
}
num++
}
console.log(num) // 8
复制代码
switch case
流程控制语句:
switch(expression){
case value1:
statement1
break;
case value2:
statement2
break;
default:
statement
}
复制代码
函数
function functionName(arg0, arg1, ...argN) {
statements
}
// -- -
function sayHi(name, word) {
console.log(`Hello ${name}!${word}`)
}
sayHi('HoMeTown', 'Welcome!')
复制代码
总结
ECMAScript 中的基本数据包括:Undefined
、Null
、Boolean
、Number
、String
、Symbol
、BigInt
。
ECMAScript 不区分整数与浮点数,都用Number
Object 是一个复杂数据类型,是 ECMAScript 中所有对象的基类。
ECMAScript 中的函数不需要制定函数返回值,默认为undefined
。
下次见~ 我的朋友,我是HoMeTown
👨💻,➕我 VX,💊你进群,这是一个大家共同成长、共同学习的社群!在这里你可以:讨论技术问题、了解前端资讯、打听应聘公司、获得内推机会、聊点有的没的。
👉 vx: hometown-468
【单独拉你】
👨👩👧 公众号:秃头开发头秃了
【关注回复“进群”】
评论