JS运算符，数组，对象思维导图
大灰
2022-11-20
JS基础知识点
运算符
数组
对象
JAVASCRIPT基础知识点——JS运算符，数组，对象
树图思维导图提供《JS运算符，数组，对象》在线思维导图免费制作，点击“编辑”按钮，可对《JS运算符，数组，对象》进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：c682f7c5f4a3854baab391db42ec2fba
思维导图大纲
相关思维导图模版
JS运算符，数组，对象思维导图模板大纲
运算符
一元运算符
delete 运算符
用来删除对象属性或者数组元素，如果删除成功或所删除的目标不存在，delete 将返回 true
不是所有的属性都可删除，一些内置核心和客户端属性是不能删除的
通过 var 语句声明的变量不能删除
通过 function 语句定义的函数也是不能删除的
void 运算符
void 运算符可以应用于任何表类型的表达式，表达式会被执行，但计算结果会被忽略并返回 undefined
typeof 运算符
++ -- 运算符
++ -- 递增递减运算符借鉴自 C 语言，它们分前置型和后置型，作用是改变一个变量的值
+ - 运算符
当 + - 作为一元运算符时，应用于数值，表示数值的正负
应用于非数值，先按 Number() 转型函数对这个值执行转换，再表示该值的正负
~ ! 运算符
~ 按位非运算符
! 逻辑非运算符
乘性运算符
* 乘法运算符
如果操作数都是数值，执行常规的乘法计算，即两个正数或两个负数相乘的结果还是正数，而如果只有一个操作数有符号，那么结果就是负数。如果乘积超过了 JavaScript 数值的表示范围，则返回 Infinity 或 -Infinity；
如果有一个操作数是 NaN，则结果是 NaN；
如果是 Infinity 与 0 相乘，则结果是 NaN；
如果是 Infinity 与非 0 数值相乘，则结果是 Infinity 或 -Infinity，取决于有符号操作数的符号；
如果是 Infinity 与 Infinity 相乘，则结果是 Infinity；
如果有一个操作数不是数值，则在后台调用 Number()将其转换为数值，然后再应用上面的规则。
/ 除法运算符
如果操作数都是数值，执行常规的除法计算，即两个正数或两个负数相除的结果还是正数，而如果只有一个操作数有符号，那么结果就是负数。如果商超过了 JavaScript 数值的表示范围，则返回 Infinity 或 -Infinity；
如果有一个操作数是 NaN，则结果是 NaN；
如果是 Infinity 被 Infinity 除，则结果是 NaN；
如果是零被零除，则结果是 NaN；
如果是非零的有限数被零除，则结果是 Infinity 或 -Infinity，取决于有符号操作数的符号；
如果是 Infinity 被任何非零数值除，则结果是 Infinity 或 -Infinity，取决于有符号操作数的符号；
如果有一个操作数不是数值，则在后台调用 Number() 将其转换为数值，然后再应用上面的规则
% 求模运算符
如果操作数都是数值，执行常规的除法计算，返回除得的余数；
如果被除数是无穷大值而除数是有限大的数值，则结果是 NaN；
如果被除数是有限大的数值而除数是零，则结果是 NaN；
如果是 Infinity 被 Infinity 除，则结果是 NaN；
如果被除数是有限大的数值而除数是无穷大的数值，则结果是被除数；
如果被除数是零，则结果是零；
果有一个操作数不是数值，则在后台调用 Number() 将其转换为数值，然后再应用上面的规则。
加性运算符
+ 加法运算符
如果两个运算符都是数值，执行常规的加法计算
如果有一个操作数是 NaN，则结果是 NaN；
如果是 Infinity 加 Infinity，则结果是 Infinity；
如果是 -Infinity 加 -Infinity，则结果是 -Infinity；
如果是 Infinity 加- Infinity，则结果是 NaN；
如果是 +0 加 +0，则结果是 +0；
如果是 -0 加 -0，则结果是 -0；
如果是 +0 加 -0，则结果是 +0;
如果有一个操作数不是数值，应用如下规则
如果两个操作数都是字符串，则将第二个操作数与第一个操作数拼接起来；
如果只有一个操作数是字符串，则将另一个操作数转换为字符串，然后再将两个字符串拼接起来。
如果有一个操作数是对象、数值或布尔值，则调用它们的 toString() 方法取得相应的字符串值，然后再应用前面关于字符串的规则。对于 undefined 和 null，则分别调用 String() 函数并取得字符串
如果是 null 加 null，则结果是 0;
如果是 undefined 加 undefined，则结果是 NaN;
- 减法运算符
如果两个运算符都是数值，执行常规的减法计算
如果有一个操作数是 NaN，则结果是 NaN；
如果是 Infinity 减 Infinity，则结果是 NaN；
如果是 -Infinity 减 -Infinity，则结果是 NaN；
如果是 Infinity 减 -Infinity，则结果是 Infinity；
如果是 -Infinity 减 Infinity，则结果是 -Infinity；
如果是 +0 减 +0，则结果是 +0；
如果是 +0 减 -0，则结果是 -0；
如果是 -0 减 -0，则结果是 +0；
如果有一个操作数不是数值，应用如下规则
如果有一个操作数是字符串、布尔值、null 或 undefined，则先在后台调用 Number() 函数将其转换为数值，然后再根据前面的规则执行减法计算。如果转换的结果是 NaN，则减法的结果就是 NaN；
如果有一个操作数是对象，则调用对象的 valueOf() 方法以取得表示该对象的数值。如果得到的值是 NaN，则减法的结果就是 NaN。如果对象没有 valueOf() 方法，则调用其 toString()方法并将得到的字符串转换为数值。
如果是 null 减 null，则结果是 0;
如果是 undefined 减 undefined，则结果是 NaN;
等值运算符
== != 运算符
如果有一个操作数是布尔值，则在比较相等性之前先将其转换为数值（false 转换为 0，而 true 转换为 1）；
如果一个操作数是字符串，另一个操作数是数值，在比较相等性之前先将字符串转换为数值；
如果一个操作数是对象，另一个操作数不是，则调用对象的 valueOf() 方法，用得到的基本类型值按照前面的规则进行比较；
null 和 undefined 是相等的。 要比较相等性之前，不能将 null 和 undefined 转换成其他任何值。
如果有一个操作数是 NaN，则相等运算符返回 false，而不相等运算符返回 true。重要提示：即使两个操作数都是 NaN，相等运算符也返回 false；因为按照规则，NaN 不等于 NaN
如果两个操作数都是对象，则比较它们是不是同一个对象。如果两个操作数都指向同一个对象，则相等运算符返回 true；否则，返回 false
=== !== 运算符
它只在两个操作数未经转换就相等的情况下返回 true
关系运算符
< > <= >= 运算符
如果两个操作数都是数值，则执行数值比较
如果两个操作数都是字符串，则比较两个字符串对应的字符编码值（可以通过字符串的 charCodeAt() 函数获取字符编码值）
如果一个操作数是数值，则将另一个操作数转换为一个数值，然后执行数值比较。
如果一个操作数是对象，则调用这个对象的 valueOf() 方法，用得到的结果按照前面的规则执行比较。如果对象没有 valueOf()方法，则调用 toString()方法，并用得到的结果根据前面的规则执行比较。
如果一个操作数是布尔值，则先将其转换为数值，然后再执行比较。
in 运算符
in 运算符希望它的左操作数是一个字符串或可以转换为字符串，希望它的右操作数是一个对象
如果右侧的对象拥有一个名为左操作数值的属性名，那么表达式返回 true
instanceof 运算符
instanceof 运算符希望左操作数是一个对象，右操作数标识对象的类
如果左侧的对象是右侧类的实例，则表达式返回 true；否则返回 false
JavaScript 中对象的类是通过初始化它们的构造函数来定义的，这样的话，instanceof 的右操作数应当是一个函数
逻辑运算符
&& 逻辑与
如果第一个操作数是对象，则返回第二个操作数；
如果第二个操作数是对象，则只有在第一个操作数的求值结果为 true 的情况下才会返回该对象；
如果两个操作数都是对象，则返回第二个操作数；
如果有一个操作数是 null，则返回 null；
如果有一个操作数是 NaN，则返回 NaN；
如果有一个操作数是 undefined，则返回 undefined
|| 逻辑或
如果第一个操作数是对象，则返回第一个操作数；
如果第一个操作数的求值结果为 false，则返回第二个操作数；
如果两个操作数都是对象，则返回第一个操作数；
如果两个操作数都是 null，则返回 null；
如果两个操作数都是 NaN，则返回 NaN；
果两个操作数都是 undefined，则返回 undefined
! 逻辑非
如果操作数是一个对象，返回 false；
如果操作数是一个空字符串，返回 true；
如果操作数是一个非空字符串，返回 false；
如果操作数是数值 0，返回 true；
如果操作数是任意非 0 数值（包括 Infinity），返回 false；
如果操作数是 null，返回 true；
如果操作数是 NaN，返回 true；
如果操作数是 undefined，返回 true
位运算符
对数值应用位运算符时，后台会发生如下转换过程：64位的数值被转换成32位数值，然后执行位操作，最后再将32位的结果转换回64位数值
这个转换过程导致了一个严重的副效应，即在对特殊的 NaN 和 Infinity 值应用位操作时，这两个值都会被当成 0 来处理
如果对非数值应用位运算符，会先使用 Number() 函数将该值转换为一个数值，然后再应用位操作，得到的结果将是一个数值
~ 按位非
简单的理解，对任一数值 x 进行按位非操作的结果为 -(x+1)
& 按位与
按位与操作就是将两个数值的每一位对齐，两个数值的对应位都是 1 时才返回 1，任何一位是 0，结果都是 0
| 按位或
按位或操作就是将两个数值的每一位对齐，两个数值只要有一个位是 1 就返回 1，只在两个位都是 0 的情况下才返回 0
^ 按位异或
按位异或与按位或的不同之处在于，两个数值只有一个 1 时才返回 1，如果对应的两位都是 1 或都是 0，则返回 0
<< 左移
将数值的所有位向左移动指定的位数
左移不会影响操作数的符号位，换句话说，如果将 -2 向左移动 5 位，结果将是 -64，而非 64
>> 有符号的右移
这个运算符会将数值向右移动，但保留符号位（即正负号标记）
>>> 无符号的右移
这个运算符会将数值的所有32位都向右移动。对正数来说，无符号右移的结果与有符号右移相同。
无符号右移运算符会把负数的二进制码当成正数的二进制码。而且，由于负数以其绝对值的二进制补码形式表示，因此就会导致无符号右移后的结果非常之大。
赋值运算符
简单的赋值运算符由等于号 = 表示，其作用就是把右侧的值赋给左侧的变量
如果在等于号 = 前面再添加乘性运算符、加性运算符或位运算符，就可以完成复合赋值操作
乘/赋值 *=；
除/赋值 /=；
模/赋值 %=；
加/赋值 +=；
减/赋值 -=；
左移/赋值 <<=；
有符号右移/赋值 >>=；
无符号右移/赋值 >>>=。
条件运算符
variable = boolean_expression ? true_value : false_value;
逗号运算符
逗号运算符多用于声明多个变量；但除此之外，逗号运算符还可以用于赋值
在用于赋值时，逗号运算符总会返回表达式中的最后一项
对象
概述
属性名：可以是包含空字符串在内的任意字符串，但对象中不能存在两个同名的属性
值：可以是任意 JavaScript 值，或者在 ECMAScript 5 中可以是 getter 或 setter 函数
属性特性（property attribute）
可写（writable attribute），表明是否可以设置该属性的值
可枚举（enumerable attribute），表明是否可以通过 for-in 循环返回该属性
可配置（configurable attribute），表明是否可以删除或修改该属性
对象特性（object attribute）
对象的类（class），是一个标识对象类型的字符串
对象的原型（prototype），指向另外一个对象，本对象的属性继承自它的原型对象
对象的扩展标记（extensible flag），指明了在 ECMAScript 5 中是否可以向该对象添加新属性
区分「三类对象」和「两类属性」
内置对象（native object），是由 JavaScript 规范定义的对象或类。例如，数组、函数、日期和正则表达式都是内置对象。
宿主对象（host object），是由 JavaScript 解释器所嵌入的宿主环境（比如 Web 浏览器）定义的。客户端 JavaScript 中表示网页结构的 HTMLElement 对象均是宿主对象。
自定义对象（user-defined object），是由运行中的 JavaScript 代码创建的对象。
自有属性（own property），是直接在对象中定义的属性
继承属性（inherited property），是在对象的原型对象中定义的属性。
创建对象
使用对象字面量创建对象（推荐）
var person = {};
使用 new 关键字创建对象
var person = new Object();
使用 Object.create() 函数创建对象
var person = Object.create(Object.prototype);
原型（prototype）
所有通过对象字面量创建的对象都具有同一个原型对象，并可以通过 JavaScript 代码 Object.prototype 获得对原型对象的引用
没有原型的对象为数不多，Object.prototype 就是其中之一。它不继承任何属性
「原型链（prototype chain）」
属性的查询和设置
通过点 . 查询，左侧应当是一个对象，右侧必须是一个以属性名称命名的简单标识符
通过方括号 []查询，方括号内必须是一个计算结果为字符串的表达式，这个字符串就是属性的名称
属性的访问错误
查询一个不存在的属性并不会报错，如果在对象 o 自身的属性或继承的属性中均未找到属性 x，属性访问表达式 o.x 返回 undefined
如果对象不存在，那么试图查询这个不存在的对象的属性就会报错
null 和 undefined 值都没有属性，因此查询这些值的属性会报错
删除属性
delete 运算符用来删除对象属性
事实上 delete 只是断开属性和宿主对象的联系，并没有真正的删除它
delete 运算符只能删除自有属性，不能删除继承属性（要删除继承属性必须从定义这个属性的原型对象上删除它，而且这会影响到所有继承自这个原型的对象）
检测属性
in 运算符的左侧是属性名（字符串），右侧是对象。如果对象的自有属性或继承属性中包含这个属性则返回 true。
对象的 hasOwnProperty() 方法用来检测给定的名字是否是对象的自有属性。对于继承属性它将返回 false
propertyIsEnumerable() 是 hasOwnProperty() 的增强版，只有检测到是自有属性且这个属性的可枚举性（enumerable attribute）为 true 时它才返回 true
使用 !== 判断一个属性是否是 undefined
然而有一种场景只能使用 in 运算符而不能使用上述属性访问的方式。in 可以区分不存在的属性和存在但值为 undefined 的属性
枚举属性
for-in 循环可以在循环体中遍历对象中所有可枚举的属性（包括自有属性和继承的属性），把属性名称赋值给循环变量
对象继承的内置方法不可枚举的，但在代码中给对象添加的属性都是可枚举的
Object.keys()，它返回一个数组，这个数组由对象中可枚举的自有属性的名称组成
Object.getOwnPropertyNames()，它和 Ojbect.keys() 类似，只是它返回对象的所有自有属性的名称，而不仅仅是可枚举的属性
属性的 getter 和 setter
由 getter 和 setter 定义的属性称做「存取器属性（accessor property）」，它不同于「数据属性（data property）」，数据属性只有一个简单的值
当程序查询存取器属性的值时，JavaScript 调用 getter 方法。这个方法的返回值就是属性存取表达式的值。
当程序设置一个存取器属性的值时，JavaScript 调用 setter 方法，将赋值表达式右侧的值当做参数传入 setter。
当程序设置一个存取器属性的值时，JavaScript 调用 setter 方法，将赋值表达式右侧的值当做参数传入 setter。
如果属性同时具有 getter 和 setter 方法，那么它是一个读/写属性。
如果它只有 getter 方法，那么它是一个只读属性。
如果它只有 setter 方法，那么它是一个只写属性
序列化对象（JSON）
对象序列化（serialization）是指将对象的状态转换为字符串，也可将字符串还原为对象。
JSON 的全称是「JavaScript 对象表示法（JavaScript Object Notation）」
ECMAScript 5 提供了内置函数 JSON.stringify() 和 JSON.parse() 用来序列化和还原 JavaScript 对象。
它支持对象、数组、字符串、无穷大数字、true、false 和 null，可以序列化和还原它们。
NaN、Infinity 和 -Infinity 序列化的结果是 null
日期对象序列化的结果是 ISO 格式的日期字符串（参照 Date.toJSON() 函数），但 JSON.parse() 依然保留它们的字符串形态，而不会将它们还原为原始日期对象
函数、RegExp、Error 对象和 undefined 值不能序列化和还原
数组
概述
数组：值的有序集合
索引：每个值叫做一个元素，而每个元素在数组中有一个位置，以数字表示，称为索引
JavaScript 数组是无类型的，数组元素可以是任意类型，并且同一个数组中的不同元素也可能有不同的类型。数组的元素甚至也可能是对象或其他数组。
JavaScript 数组是动态的，根据需要它们会增长或缩减，并且在创建数组时无须声明一个固定的大小或者在数组大小变化时无须重新分配空间。
JavaScript 数组可能是稀疏的，数组元素的索引不一定要连续的，它们之间可以有空缺。每个 JavaScript 数组都有一个 length属性。针对非稀疏数组，该属性就是数组元素的个数。针对稀疏数组，length 比所有元素的索引要大。
JavaScript 数组是 JavaScript 对象的特殊形式，数组索引实际上和碰巧是整数的属性名差不多。通常，数组的实现是经过优化的，用数字索引来访问数组元素一般来说比访问常规的对象属性要快很多。
数组继承自 Array.prototype 中的属性，它定义了一套丰富的数组操作方法。
创建数组
使用数组字面量创建数组（推荐）
var empty = [];
使用 new 关键字创建数组
var a = new Array();
数组元素的读和写
使用 [] 操作符来访问数组中的一个元素。数组的引用位于方括号的左边。方括号中是一个返回非负整数值的任意表达式。
稀疏数组
稀疏数组就是包含从0开始的不连续索引的数组
数组的 length 属性值代表数组中元素的个数
如果数组是稀疏的，length 属性值大于元素的个数
数组长度
针对稠密（也就是非稀疏）数组，length属性值代表数组中元素的个数。其值比数组中最大的索引大1。
在 ECMAScript 5 中，可以用 Object.defineProperty() 让数组的 length 属性变成只读的
数组元素的添加和删除
添加数组元素最简单的方法，为新索引赋值
也可以使用 push() 方法在数组末尾增加一个或多个元素
可以像删除对象属性一样使用 delete 运算符来删除数组元素
对一个数组元素使用 delete 不会修改数组的 length 属性，也不会将元素从高索引处移下来填充已删除属性留下的空白。如果从数组中删除一个元素，它就变成稀疏数组。
数组遍历
使用 for 循环是遍历数组元素最常见的方法
还可以使用 for-in 循环处理稀疏数组
数组检测
在 ECMAScript 5 中，可以使用 Array.isArray() 函数
检查对象的类属性，对数组而言该属性的值总是
数组方法
转换方法
valueOf()：当调用数组的 valueOf() 方法，会返回 Array 对象的原始值。valueOf() 方法通常由 JavaScript 在后台自动调用，并不显式地出现在代码中。
toString()：当调用数组的 toString() 方法，会返回以逗号分隔数组中每个值的字符串。为了创建这个字符串会调用数组每一项的 toString() 方法
toLocaleString()：当调用数组的 toLocaleString() 方法，会返回以逗号分隔数组中每个值的字符串。为了创建这个字符串会调用数组每一项的 toLocaleString() 方法
join() 方法，使用不同的分隔符来构建这个字符串。join() 方法只接收一个参数，即用作分隔符的字符串，然后返回包含所有数组项的字符串
如果数组中的某一项的值是 null 或者 undefined，那么该值在 join()、toLocaleString()、toString() 和 valueOf() 方法返回的结果中以空字符串表示。
栈方法
栈是一种 LIFO（Last-In-First-Out，后进先出）的数据结构，也就是最新添加的项最早被移除
push() 方法可以接收任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度
pop() 方法则从数组末尾移除最后一项，减少数组的 length 值，然后返回移除的项
结合 push() 和 pop() 方法，就可以像栈一样使用数组
队列方法
队列是一种 FIFO（First-In-First-Out，先进先出）的数据结构，队列在列表的末端添加项，从列表的前端移除项
shift() 方法则从数组前端移除第一项，减少数组的 length 值，然后返回移除的项
结合 push() 和 shift() 方法，就可以像队列一样使用数组
unshift() 方法，顾名思义，unshift() 与 shift() 的用途相反，它能在数组前端添加任意个项并返回新数组的长度
重排序方法
reverse() 方法可以反转数组元素的顺序
sort() 方法可以按升序排列数组元素（即最小的值位于最前面，最大的值排在最后面）
操作方法
concat()
concat() 方法可以基于当前数组中的所有项创建一个新数组
在没有给 concat() 方法传递参数的情况下，它只是复制当前数组并返回副本
如果传递给 concat() 方法的是一或多个数组，则该方法会将这些数组中的每一项都添加到结果数组中
如果传递的值不是数组，这些值就会被简单地添加到结果数组的末尾
slice()
slice() 方法可以接受一或两个参数，即要返回项的起始和结束位置
在只有一个参数的情况下，slice() 方法返回从该参数指定位置开始到当前数组末尾的所有项
如果有两个参数，该方法返回起始和结束位置之间的项，但不包括结束位置的项
splice()
删除：可以删除任意数量的项，只需指定2个参数：起始位置和要删除元素的数量。例如，splice(0,2) 会删除数组中的前两项。
插入：可以向指定位置插入任意数量的项，只需提供3个参数：起始位置、0（要删除元素的数量）和要插入的元素。如果要插入多个元素，可以再传入第四、第五，以至任意多个元素。例如，splice(2,0,
替换：可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需指定3个参数：起始位置、要删除元素的数量和要插入的元素。插入的项数不必与删除的项数相等。例如，splice (2,1,
位置方法
ECMAScript 5 为数组实例添加了两个位置方法：indexOf() 和 lastIndexOf()。
这两个方法都接收两个参数：要查找的项和（可选的）表示查找起点位置的索引
indexOf() 方法从数组的开头（位置0）开始向后查找，lastIndexOf() 方法则从数组的末尾开始向前查找
这两个方法都返回要查找的项在数组中的位置，或者在没找到的情况下返回 -1
在比较第一个参数与数组中的每一项时，会使用全等操作符；也就是说，要求查找的项必须严格相等（就像使用 === 一样）
迭代方法
every()，对数组中的每一项运行给定函数，如果该函数对每一项都返回 true ，则返回 true
filter()，对数组中的每一项运行给定函数，返回该函数会返回 true 的项组成的数组。
forEach()，对数组中的每一项运行给定函数。这个方法没有返回值。
map()，对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。
some()，对数组中的每一项运行给定函数，如果该函数对任一项返回 true ，则返回 true。
查看更多
SpringBootWeb请求响应思维导图
U482218638树图思维导图提供《SpringBootWeb请求响应》在线思维导图免费制作，点击“编辑”按钮，可对《SpringBootWeb请求响应》进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：1c6ee1ff958a0c7c2fabdf9e9f8d755e
四种常用运算符思维导图
U281067260树图思维导图提供《四种常用运算符》在线思维导图免费制作，点击“编辑”按钮，可对《四种常用运算符》进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：59dc73284171ff1cb99ceabca49e5c13
相似思维导图模版
首页
我的文件
我的团队
个人中心