共计 4138 个字符，预计需要花费 11 分钟才能阅读完成。
文 / 景晚霞
起源公号 / 晚霞的光影笔记
ID / zhaoxiajingjing
图 / 本人画
❥❥❥❥点个赞，让我晓得你来过~❥❥❥❥
0 / JS 中的数据类型的一些细节点
（1）JS 中的数据类型
根本数据类型
1、string，能够用双引号、单引号、反引号
2、number，比方：值有123/1.2/NaN/Infinity/-Infinity...
3、boolean，值为true/false
4、null，值为null
5、undefined，值为undefined
6、bigint
7、symbol，用于创立惟一值
援用数据类型
1、object 例如：
① {}一般对象
② []数组对象
③ 日期对
④ 正则，比方：/^\\d+$/
⑤ ……
2、function
① 一般函数
② 构造函数
③ 箭头函数
④ 生成器函数
⑤……
（2）number 的一些细节
number类型的值有：
1、负数、正数、零、小数 ……
2、NaN not a number 不是一个有效数字，然而它是 number 类型的
xxx，你不是一个人。不是一个人，那是什么都有可能了
① NaN 和 NaN 自身不相等，和其余值也不相等
② isNaN(vlaue)检测以后值 是否不是一个有效数字，不是有效数字返回 true；反之，是有效数字返回 false
③ Object.is(NaN, NaN)后果是true，它的外部做了非凡解决
3、Infinity无限大 -Infinity无限小
console.log(typeof NaN); //=> 'number'
console.log(typeof Infinity); //=> 'number'
console.log(NaN == NaN); //=> false
console.log(NaN === NaN); //=> false
console.log(Object.is(NaN, NaN)); //=> true△ NaN
API Object.is
把其它数据类型值转换为 number 类型：
1、显式转换：Number(vlaue) 或者 parseInt(value)/parseFloat(value) 他们底层解决的规定不一样
2、隐式转换（逻辑用的是 Number(value) 的）
① 数学运算
② 基于 == 比拟的时候
③ isNaN(value)
④ ….
（3）字符串的一些细节点
string字符串：单引号、双引号、反引号，外面的内容都是字符串
其它值转换为字符串：
1、显式转换：String(value)或者 (vlaue).toString() 波及到数据类型检测，前面再说
2、隐式转换：加号除了数学运算，还会产生字符串拼接
+ 加号是斜杠青年
let n = '10',
m = 10;
console.log(10 + n);
console.log(+n);
console.log(++n);
let obj = {};
console.log(10 + obj);
console.log(10 + new Number(10));
console.log(10 + {id:'zhaoxiajingjing'});△ 后果是多少？
+ 作为斜杠青年，本职工作是数学运算符，还斜杠负责了字符串拼接的工作，那它什么时候切换角色呢？
+只有一边有内容时 ：比方+n，把值转换为数字；++n/n++ 也会把值转换为数字，而后再进行 前置 / 后置自增 的运算
+ 两边都有内容时：
1、”+” 有一边呈现了字符串，就会变成 字符串拼接
2、”+” 有一边是对象，则也可能会成为字符串拼接：
△ 图 1.1_”+” 作为一枚斜杠青年
其中：①③失去的是数字 10，起因是：{...} 没有参加运算，浏览器认为这是一个代码块，计算的是+10
而：console.log({}+10) 有一个括号把 {}+10 包起来了，它会认为这是一个整体再进行运算
那么，对象在做数学运算时的底层机制：
（1）检测对象的Symbol.toPrimitive【primitive [ˈprɪmətɪv] n. 原始的】这个属性值，如果有则基于这个值进行运算，如果没有，走下一步
（2）检测对象的 valueOf() 这个值【原始值 / 根本类型值】，如果有则基于这个值进行运算，如果不是原始值，走下一步
（3）获取对象的 toString() 把其变为字符串 => 如果是 ” +“ 解决，则看到字符串了，变为字符串拼接
（4）如果最初就是想要失去的数字，则再把字符串转换为数字即可
let obj = {[Symbol.toPrimitive]:function (){return 10;}
};
console.log(10 + obj); //=> 20△ 对象取得的是数字
而，console.log(10 + new Number(10))的后果就是数字 20，是因为new Number(10).valueOf() 取得的原始值就是数字 10
∴ 答案是：
let n = '10',
m = 10;
console.log(10 + n); //=> 字符串拼接：'1010'
console.log(+n); //=> 把值转换为数字：10
console.log(++n); //=> 把值转换为数字，在前置自增：11
let obj = {};
console.log(10 + obj); //=> '10[object Object]'
console.log(10 + new Number(10)); //=> 20
console.log(10 + {id:'zhaoxiajingjing'}); //=> '10[object Object]'△ + 是一枚斜杠青年
那么，请问：i=i+1 i+=1; ++i/i++ 这三个一样吗？
其中：i=i+1和 i+=1 是一样的；++i/i++大部分状况是与后面的一样的。
如果 i 的值是字符串则不一样了：
i=i+1 i+=1会解决为字符串拼接
++i/i++先把值转为数字，再进行前置 / 后置累加
（4）symbol 惟一值
API：https://developer.mozilla.org…
Symbol()：创立惟一值
Symbol() 函数会返回 symbol 类型的值
new Symbol()报错：Uncaught TypeError: Symbol is not a constructor
△ 图 1.2_symbol 类型
Symbol.toPrimitive
API：Symbol.toPrimitive
Symbol.toPrimitive是一个内置的 Symbol 值，它是作为对象的函数值属性存在的，当一个对象转换为对应的原始值时，会调用次函数
let obj = {[Symbol.toPrimitive]:function (hint){console.log(hint); // hint 取值："number/string/default"
return 10;
}
};
console.log(10 + obj); //=> 20 hint 输入 'default'
Number(obj); //=> hint 输入 'number' obj 的原始值 10
String(obj); //=> hint 输入 'string' obj 的原始值 '10'△ Symbol.toPrimitive
（5）BigInt 大数
API：BigInt
△ 图 1.3_bigint
2 / 栈内存 Stack & 堆内存 Heap
（1）题很简略
var a = 12;
var b = a;
b = 13;
console.log(a);
-----------------
var a = {n: 12};
var b = a;
b['n'] = 13;
console.log(a.n);
-----------------
var a = {n: 12};
var b = a;
b = {n: 13};
console.log(a.n);△ 做题很简略，要害要理解外面的机制
（2）第一题
咱们新建一个 index.html 文件，在外面引入 1.js 文件，而后关上浏览器拜访 index.html 文件时，浏览器会渲染 JS
那么 JS 能够执行的环境：
① 浏览器：浏览器的内核 =>JS 渲染引擎
② 挪动端 Hybrid 混合 APP => webview 基于 webkit 内核
③ Node
④ ……
浏览器会专门开拓一块内存来执行 JS 代码 => 栈内存，执行环境栈ECStack（Execution Context Stack）
会有一个供全局代码执行的区域：全局执行上下文，EC(G)（Execution Context Global）
造成上下文的目标：辨别不同区域的代码执行
比方：全局执行上下文、函数执行上下文……
执行上下文会进入到执行环境栈中运行，当浏览器敞开时全局执行上下文就会出栈销毁
△图 1.4_第一题简图
var a = 12;
第一步：创立值
① 根本值间接存到栈内存中
② 援用值是独自开拓一块新的内存来存储
第二步：申明变量 declare
第三步：变量和值关联在一起，定义 defined
∴ var c; 只进行变量申明 declare，并未定义 undefined，console.log(c);//=>undefined
（3）第二题
△图 1.5_第二题简图
创立值：
1、根本数据类型间接存储到栈外面
2、援用数据类型：
（1）独自开拓一块内存 heap 堆内存
（2）每一个堆内存都有一个 16 进制地址 JS 中不能获取到这个地址，16 进制以 0x 结尾
（3）把键值对别离存储到堆中
（4）把 16 进制地址放到栈中存储：不便前期变量的关联
援用数据类型：变量操作的都是对 堆内存地址 的援用
b['n']=13;
① b 基于地址 0x000001 找到堆内存
② 把堆内存中属性名为 n 的属性值改为 13
（4）第三题
△图 1.6_第三题简图
（5）堆栈内存作用
栈内存 or 堆内存，都是浏览器从计算机中调配进去的内存，开拓的越多，电脑性能越慢 => 性能优化：内存优化
栈内存作用：代码执行和存储根本类型值
堆内存作用：存储援用数据类型
3 / 作业
var a = {n: 1};
var b = a;
a.x = a = {n: 2};
console.log(a.x);
console.log(b);△ 第一题
个别状况下：a=b=xxx的运算程序是：
① b=xxx
② a=xxx
然而，当 a.x=b=xxx 时，a.x中的 ”点“ 是成员拜访，它的运算符优先级很高：
① a.x = xxx
② b = xxx
var x = [12, 23];
function fn(y) {y[0] = 100;
y = [100];
y[1] = 200;
console.log(y);
}
fn(x);
console.log(x);△ 第二题
– end –
