开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第6天,点击查看活动详情
4、深复制
<script>
const obj = {
name: '孙悟空',
friend:{
name:'猪八戒',
},
}
//对obj进行浅复制
const obj2 = Object.assign({},obj)
//对obj进行深复制
const obj3 = structuredClone(obj)
//利用JSON来完成深复制
const str = JSON.stringify(obj)
const obj4 = JSON.parse(str)
const obj5 = JSON.parse(JSON.stringify(obj))//与上面两行代码的效果相同
</script>
5、Map
Map(key-value)
-
Map用来存储键值对结构的数据(key-value)
-
Object中存储的数据就可以认为是一种键值对结构
-
Map和Object的主要区别:
- Object中的属性名只能是字符串或符号,如果传递了一个其他类型的属性名, JS解释器会自动将其转换为字符串
- Map中任何类型的值都可以称为数据的key
创建:
new Map()
属性和方法:
- map.size() 获取map中键值对的数量
- map.set(key, value) 向map中添加键值对
- map.get(key) 根据key获取值
- map.delete(key) 删除指定数据
- map.has(key) 检查map中是否包含指定键
- map.clear() 删除全部的键值对
<script>
const obj2 = {}
const obj = {
'name':'孙悟空',
'age': 18,
[Symbol()] : '哈哈',
[obj2] : '嘻嘻'
}
console.log(obj)
//创建一个Map
const map = new Map()
map.set('name','孙悟空')
map.set(obj2,'呵呵');
map.set(NaN,'哈哈哈')
map.delete(NaN)
// map.clear()
console.log(map)
console.log(map.get('name'))//孙悟空
console.log(map.has('name'))//true
</script>
map.keys()
- 获取map的所有的key
map.values()
- 获取map的所有的value
<script>
const map = new Map()
map.set('name','孙悟空')
map.set('age',19)
map.set({},'呵呵')
//将map转换为数组
// const arr = Array.from(map)
const arr = [...map]
const map2 = new Map([
['name','猪八戒'],
['age', 18],
[{},() => {}],
]);
//遍历map
for(const [key, value] of map){
// const [key,value] = entry
console.log(key,value)
}
map2.forEach((key,value) => {
console.log(key,value)
})
for(const key of map.keys()){
console.log(key)
}
</script>
6、Set
Set - Set用来创建一个集合 - 它的功能和数组类似,不同点在于Set中不能存储重复的数据
-
使用方式: 创建 - new Set() - new Set([...])
方法 size 获取数量 add() 添加元素 has() 检查元素 delete() 删除元素
<script>
//创建一个Set
const set = new Set()
//向set中添加数据
set.add(10)
set.add('孙悟空')
set.add(10)//无法重复添加数据
for(const item of set){
console.log(item)
}
const arr = [...set]
const arr2 = [1,2,3,2,1,3,4,5,4,6,7,7,8,9,10]
const set2 = new Set(arr2)
console.log([...set2])
</script>
7、Math
Math
-
Math一个工具类
-
Math中为我们提供了数学运算相关的一些常量和方法
-
常量: Math.PI 圆周率
-
方法:
Math.abs() 求一个数的绝对值
Math.min() 求多个值中的最小值 Math.max() 求多个值中的最大值 Math.pow() 求x的y次幂 Math.sqrt() 求一个数的平方根
Math.floor() 向下取整 Math.ceil() 向上取整 Math.round() 四舍五入取整 Math.trunc() 直接去除小数位
Math.random() 生成一个0-1之间的随机数
<script>
let result = Math.abs(10)
result = Math.abs(-10)//取绝对值
result = Math.min(10, 20, 30, 44, 55, -1)
result = Math.max(10, 20, 30, 44, 55, -1)
result = Math.pow(4, 2) // 4 ** 2
result = Math.sqrt(4) // 4 ** .5
result = Math.floor(1.2)
result = Math.ceil(1.2)
result = Math.round(1.4)
result = Math.trunc(1.5)
for (let i = 0; i < 50; i++) {
/*
生成0-5之间的随机数
Math.random() --> 0 - 1
// 生成 0-x之间的随机数:
Math.round(Math.random() * x)
Math.floor(Math.random() * (x + 1))
// 生成 x-y 之间的随机数
Math.round(Math.random() * (y-x) + x)
// */
result = Math.round(Math.random() * 5)
// result = Math.floor(Math.random() * 6)
// 1-6
// result = Math.round(Math.random() * 5 + 1)
// 11 - 20
result = Math.round(Math.random() * 9 + 11)
console.log(result)
}
</script>