对象字面量
属性名可以用表达式
const obj = {
[“na”+”me”]: {
return “张三”
},
[‘ag’ + ‘e’] : 18
}
console.log(obj)
打印结果,{ hello: f(), age: 18}
对象的拓展运算符…
const user = { 'name': '张三', 'age': 18, 'height': '170'}
console.log({ …user })
打印结果 { 'name': '张三', 'age': 18, 'height': '170’}
可用于合并两个对象
const other = { ‘weight’: 60 }
const result = { …user, …other }
打印结果{ 'name': '张三', 'age': 18, 'height': '170’, ‘weight’: 60}
同名属性,后面的会将前面的覆盖掉,扩展运算符后面是null、undefined,会直接忽略掉
对象的新方法
Object.assign(target,source1,…)
参数1,目标对象;参数二,源对象
target不能为null或者undefined,source1可以是null或者undefined
该方法为浅拷贝,只拷贝了指针,并未对地址进行拷贝,修改了其中一个的属性,另一个对象的属性也会跟着变动
同名属性会被覆盖
const target = { name: ‘张三’,age:18 };const source = { name: ‘李四‘, height:170}
Object.assign(target, source)
打印结果为 {age:18, name: ‘李四‘, height:170}
如果target和source为数组对象
const target = [1,2,4];const source = [5]
Object.assign(target, source)
打印结果为[5,2,4]
原因是该方法将数组处理成对象,key为数组的index,然后再合并,由于同名属性覆盖导致
数组
Array.of()
将所有值作为元素形成数组,参数为空返回空数组
Array.from(arrayLike,mapFn,thisArg)
参数1,类数组对象,可迭代对象
参数2,map函数
参数3,可选参数,指定map函数执行时的this对象
Tip:
1.如果arrayLike中存在空位,会用undefined填充
2.mapFn:按照map函数的逻辑执行arrayLike里面的所有数据
3.thisArg:指定mapFn的this,也就是指定哪个对象的mapFn函数
类数组对象,必须含有length属性,且元素属性名必须是数值或者可转换为数值的字符
Array.from({ 0: ‘0’, 1: ‘1’, 2: ‘2’, length: 3 })
没有length,返回空数组
可迭代对象
map,set,字符串
数组扩展的方法
find(),查找数组中符合条件的元素,有多个返回第一个元素
const result = ['1', '2', '3', '5', '9', ‘5’].find(item => item === ‘5’) result = ‘5’
Tip:没有值返回undefined
findIndex(),查找数组中符合条件的元素索引,有多条返回第一个元素的索引
const result = ['1', '2', '3', '5', '9', ‘5’].find(item => item === ‘5’) result = 3 没有值返回-1
Fill(data,start,end),将一定范围索引的数组元素内容填充为单个指定的值
参数1,用来填充的值
参数2,起始索引值
参数3,可选参数,结束索引,默认为数组末尾
[1,2,3,4].fill(0,1,2) = [1,0,3,4]
copyWithin(start1,start2,end2),将一定范围索引的数组元素修改为此数组另一指定范围索引的元素
参数1,被修改的起始索引
参数2,被用来覆盖的数据的起始索引
参数3,可选参数,被用来覆盖的数据的结束索引,默认为数组末尾
entries()遍历键值对
const data = [‘name’, ‘age’]
for (const [key, value] of data.entries()) {
console.loe(key, value)
}
打印结果:0:‘name’ 1: ‘age’
const entries = data.entries()
console.log(entries.next().value) // [0, ‘name’]
console.log(entries.next().value) // [1, ‘age’]
数组的扩展运算符
const arr = [‘name’, ‘age’, ‘height’]
const other = [ , ’weight’]
const newArr = […arr, …other ]
Tip:如果other里面有空,返回数组的长度不变,在它应在的index下值为空
console.log([…newArr.values()])
打印结果:['name', 'age', 'height', undefined, 'weight']
includes()
数组中的元素为有属性的对象,这种方式检查不出来是否包含该对象
const list = [ { name: ‘1’,age: 1 }, { name: '2', age: 2 }, { name: '3', age: 3 }]
List.includes({ name: ‘1’, age: 1})
打印结果:false
Tip:可以检查出数组里面有NAN
嵌套数组转一维数组
flat() 参数为指定数组嵌套层数,不填写或者填写Infinity均转为一维数组
const arr = [‘人’, ,‘之’, ‘初’, [‘性’, ,’本’, ‘善’]]
console.loe( arr.flat() )
打印结果 [‘人’, ‘之’, ‘初’, ‘性’, ‘本’, ‘善’]
Tip: 如果有空格,会跳过
flatMap(mapFn, thisArg) 先对数组遍历,再执行再执行flat方法
参数1,执行的函数(可以指定三个参数,1:当前元素,2:当前元素索引,3:原数组),参数2,参数1的对象
const list = ['人', '之', '初', ['性', '本', '善']]
console.log('---', list.flatMap((value, index, arr) => { return value + '1' }))
打印结果 [‘人1’, ‘之1’, ‘初1’, ‘性, 本, 善1’]