共计 4043 个字符，预计需要花费 11 分钟才能阅读完成。
函数
动态参数
arguments 是函数内部内置的伪数组变量，它包含了调用函数时传入的所有实参。
function sum() {
let s = 0
for (let i = 0; i < arguments.length; i++) {s += arguments[i]
}
console.log(s)
}
sum(1, 3, 5)剩余参数
… 是语法符号，用于获取多余的实参，是个真数组。实际开发中，推荐使用剩余参数。
function sum(a, b, ...other) {
let s = a + b
for (let i = 0; i < other.length; i++) {s += other[i]
}
console.log(s)
}
sum(1, 3, 5, 7)箭头函数 this
箭头函数没有自己的 this，它的 this 由外层作用域决定，只会从自己作用域链上一层沿用 this。所以说，箭头函数的 this 和它的调用方式无关。
如果直接在箭头后设置对象字面量为返回值时，对象字面量必须使用 () 括起来。
const fn = () => ({ name: '李小龙'})
console.log(fn())根据函数调用方式的不同，this 值也不同:
- 以函数形式调用，this 是 window
- 以方法形式调用，this 是调用方法的对象
- 构造函数中，this 是新建对象
- 箭头函数没有自己的 this，由外层作用域决定
- 通过 call 和 apply 调用的函数，它们的第一个参数就是函数的 this
- 通过 bind 返回的函数，this 由 bind 第一个参数决定(无法修改)
箭头函数没有自己的 this，所以无法通过 call、apply 和 bind 修改它的 this，箭头函数中也没有 arguments。
内置构造函数
Object
const obj = {name: "佩奇", age: 12}
console.log(Object.keys(obj)) //['name', 'age']
console.log(Object.values(obj)) //['佩奇', 12]
Object.assign(obj, { sex: "女"}) // 拷贝对象
console.log(obj) //{name: '佩奇', age: 12, sex: '女'}Array
filter，筛选数组
const arr = [1, 4, 7, 9]
const newArr = arr.filter(function (value, index) {return value > 5})
console.log(newArr) //[7, 9]reduce
const arr = [1, 3, 5]
const total = arr.reduce(function (prev, current) {return prev + current})
console.log(total) //9
// 有初始值
const total2 = arr.reduce(function (prev, current) {return prev + current}, 10)
console.log(total2) //19
// 箭头函数写法
const total3 = arr.reduce((prev, current) => prev + current, 10)
console.log(total3) //19find，找到就返回。
const arr = [{ name: "佩奇", age: 18},
{name: "乔治", age: 16},
]
const p = arr.find(function (item) {return item.name === "佩奇"})
console.log(p) //{name: '佩奇', age: 18}findIndex()用于找出第一个符合条件的数组成员的位置，如果没有找到返回 -1。
some，有一个符合条件就返回 true，否则返回 false。
const arr = [1, 4, 7, 9]
const flag = arr.some(function (value, index) {return value > 5})
console.log(flag) //true注意：在 some 里面遇到 return true 会终止遍历，迭代效率更高。
every，每一个是否都符合条件，都符合返回 true，否则返回 false。
const arr = [1, 5, 8]
const flag = arr.every((item) => item >= 1)
console.log(flag) //truefrom，把伪数组转换为真数组。
const lst = document.querySelectorAll("ul li")
const lst2 = Array.from(lst)
console.log(lst2)String
const str = "佩奇, 乔治"
const arr = str.split(",")
console.log(arr) //['佩奇', '乔治']
console.log(str.substring(2)) //, 乔治
console.log(str.substring(3, 5)) // 乔治
console.log(str.startsWith("佩奇")) //true
console.log(str.includes("佩奇")) //true深浅拷贝
浅拷贝
如果是简单数据类型拷贝值，引用数据类型拷贝的是地址（简单理解，如果是单层对象，没问题，如果有多层就有问题）。
const obj = {
name: "佩奇",
age: 10,
}
// 方法一
const obj2 = {...obj}
obj2.age = 12
console.log(obj.age) //10
console.log(obj2.age) //12
// 方法二
const obj3 = {}
Object.assign(obj3, obj)
obj3.age = 14
console.log(obj.age) //10
console.log(obj3.age) //14
const arr = [{age: 18}, {age: 20}]
const arr2 = arr.slice() // 浅拷贝
const arr3 = structuredClone(arr) // 深拷贝
console.log(arr2[0] === arr[0]) //true
console.log(arr3[0] === arr[0]) //false深拷贝
方法一，递归实现：
const obj = {
name: "佩奇",
age: 10,
hobby: ["唱歌", "跳舞"],
}
function deepCopy(newObj, oldObj) {for (let k in oldObj) {if (oldObj[k] instanceof Array) {newObj[k] = []
deepCopy(newObj[k], oldObj[k])
} else if (oldObj[k] instanceof Object) {newObj[k] = {}
deepCopy(newObj[k], oldObj[k])
} else {newObj[k] = oldObj[k]
}
}
}
const obj2 = {}
deepCopy(obj2, obj)
obj2.hobby[0] = "睡觉"
console.log(obj.hobby[0]) // 唱歌方法二，使用 js 库 lodash 里面的 cloneDeep 实现：
<script src="https://cdn.bootcdn.net/ajax/libs/lodash.js/4.17.21/lodash.min.js"></script>
<script>
const obj = {
name: "佩奇",
age: 10,
hobby: ["唱歌", "跳舞"],
}
const obj2 = _.cloneDeep(obj)
obj2.hobby[0] = "睡觉"
console.log(obj.hobby[0]) // 唱歌
</script>方法三，使用 JSON 字符串转换实现：
const obj = {
name: "佩奇",
age: 10,
hobby: ["唱歌", "跳舞"],
}
const obj2 = JSON.parse(JSON.stringify(obj))
obj2.hobby[0] = "睡觉"
console.log(obj.hobby[0]) // 唱歌Map
Map 用来存储键值对结构的数据 (key-value)。
Map 和 Object 的主要区别:
- Object 中的属性名只能是字符串。如果传递了一个其他类型的属性名，JS 解释器会自动将其转换为字符串
- Map 中任何类型值都可作为 key
属性和方法:
- map.size()获取 map 中键值对的数量
- map.set(key，value)向 map 中添加键值对
- map.get(key)根据 key 获取值
- map.delete(key)删除指定数据
- map.has(key)检查 map 中是否包含指定键
- map.clear()删除全部的键值对
const map = new Map() // 空 Map
map.set('name', '李小龙') // 添加 key-value
console.log(map.has('name')) // true 是否存在 key
map.set(NaN, '呵呵')
console.log(map.get(NaN)) // 呵呵 获取 value
map.delete(NaN) // 删除 key
console.log(map) // Map(1) {'name' => '李小龙'}
// Map 转数组
const arr = Array.from(map) // 方法一
const arr2 = [...map] // 方法二
// 数组转 Map
const map2 = new Map([['name', '猪八戒'],
['age', 18],
])
console.log(map2) //{'name' => '猪八戒', 'age' => 18}Set
用来创建一个集合，功能和数组类似，不同点在于 Set 中不能存储重复数据。
方法：
- size 获取数量
- add()添加元素
- has()检查元素
- delete()删除元素
const set = new Set()
set.add(1)
set.add('李小龙')
console.log(set) //{1, '李小龙'}
正文完
