在这里我会写些自己认为ES6此书中常用的对象方法及注意事项
一、Object.assign(target, source)
作用:将所有可枚举属性的值从一个或多个源对象【source】复制到目标对象【target】。
target:可以是对象也可以是数组
source:可以是对象、数组、字符串【允许多个】
基本用法
const obj1 = {
a: 'a',
}
const obj2 = {
b: 'b',
}
// 情况一
console.log(Object.assign({}, {...obj1, ...obj2} )) // {a: "a", b: "b"} source可以为一个
console.log(Object.assign({}, obj1, obj2 )) // {a: "a", b: "b"} source也可以为多个
// 情况二
console.log(Object.assign({}, ['a'] )) // {0: "a"}
// 情况三
console.log(Object.assign({}, 'a' )) // {0: "a"}
// 情况四
console.log(Object.assign([], obj1, obj2)) // [a: "a", b: "b"]类map数据结构
// 情况五
console.log(Object.assign([], ['a'])) // ["a"]
// 情况六
console.log(Object.assign([], 'a')) // ["a"]
注意事项
1、在作用于数组或则对象的拷贝复制时
数据源source中,若其内部子元素或则属性值为基本类型时,Object.assign()的拷贝为深拷贝;若其内部存在引用类型的子元素或则属性值时,Object.assign()的拷贝为浅拷贝。
let obj = {
a: 'a',
b: 'b',
c: {
foo: 'foo',
},
}
let arr = ['a', 'b', ['c', 'd']]
const copyObj = Object.assign({}, obj)
const copyArr = Object.assign([], arr)
obj.c.foo = 'onchange'
arr[2] = Object.assign(arr[2], ['3', '4'])
console.log(copyObj) // {a: "a", b: "b", c: {foo: "onchange"}}
console.log(copyArr) // ["a", "b", ["3", "4"]]
2、source的赋值存在替换规则
let obj = {
a: 'a',
b: 'b',
}
let arr = ['a', 'b']
const copyObj = Object.assign({a: 'A', b: 'B'}, obj)
const copyArr = Object.assign([1, 2], arr)
console.log(copyObj) // {a: "a", b: "b"}
console.log(copyArr) // ["a", "b"]
适用场景
1、为对象添加属性
Object.assign({}, {newAttr: 'newAttr'})
2、为对象添加方法
Object.assign({}, {method() {} })
3、克隆对象或则数组【注意:其上述的注意事项一】
let obj = {
a: 'a',
b: 'b',
}
let arr = ['a', 'b']
const copyObj = Object.assign({}, obj)
const copyArr = Object.assign([], arr)
console.log(copyObj) // {a: "a", b: "b"}
console.log(copyArr) // ["a", "b"]
4、合并多个对象【建议使用扩展运算符进行合并,只是单纯的个人喜好】
Object.assign({}, obj1, obj2)
二、Object.defineProperty(objectName, attrName, config…)
作用:重新定义某个属性的属性特性
适用场景:为对象的某些特定属性修改原先的属性特性,比如可枚举性,可重写性,可配置性
注意事项:所对应的attrName的configurable必须为true,否则报错
三、Object.prototype.hasOwnProperty(attrName)
作用:判断目标对象是否具有此属性名,返回值为boolean型
适用场景:检测目标对象是否具有此属性名
const obj = {
a: 'a',
b: 'b',
}
console.log(obj.hasOwnProperty('a')) // true
四、Object.is(arg1, arg2)
作用:比较两个值(对象)是否严格相等,返回值为boolean型
适用场景:判断两个值是否严格相等,包括可以比较NAN与NAN,+0与-0
Object.is(NaN, NaN) // true
Object.is(+0, -0) // false
五、Object.keys()、Object.values()、Object.entries()、Object.fromEntries()
捆绑原因:因为这四个是对对象的键值对配套的操作方法
Object.keys():以数组形式返回键名
Object.values():以数组形式返回键值
Object.entries():以map形式返回键值对
Object.fromEntries():将map形式数据转化为对象
const { keys, values, entries, fromEntries } = Object
const obj = {
a: 'value_a',
b: 'value_b',
}
const mapStruct = entries(obj)
console.log(keys(obj)) // ["a", "b"]
console.log(values(obj)) // ["value_a", "value_b"]
console.log(mapStruct) // [["a", "value_a"], ["b", "value_b"]] map数据结构
console.log(fromEntries(mapStruct)) // {a: "value_a", b: "value_b"}
详细mdn文档