【JS】对象的理解和解构赋值

对象的理解和解构赋值

joychenke发布于 15 分钟前

这篇文章是看js红宝书后,记录的学习笔记。

对象属性:

访问器属性: 通过Object.defineProperty( ) 来设置。当获取属性时,会调用属性的获取方法get( );当设置属性时,会调用set( )
Object.defineProperties(obj, {}) 可以用来定义对象obj的对个属性。

Object.getOwnPropertyDescriptor(obj,key ) 方法获取对象obj指定属性key的属性描述符。Object.getOwnPropertyDescriptors(obj) 获取obj的所有属性。

实用的对象方法:

Object.assign(targetObj, obj1, obj2) 将obj1,obj2对象的属性混入到targetObj,Object.assign( )的返回值是对象targetObj,是浅复制。

Object.is(val1, val2) 和三等号基本保持一致,Object.is( )方法方便使用的场景是NaN的判断,比如:Object.is(NaN, parseInt('ss’)) 返回值是true

对象的几个增强语法:

1,属性的简写

const name = ‘cc'

const obj = {name}

2,可计算属性

const key = ‘xixi’

const obj = {[key]: ‘cc’}

3, 简写方法名,如 vue中methods定义的方法名。

对象解构:

1, 将对象的属性取出来,赋给一个全新变量
取的属性不存在时,值是undefined;可以给取的属性加默认值

const {name: objName, age: objAge} = {name: 'cc', age: 31}

console.log(objName,objAge) // 'cc' 31

2,给null和undefined解构,会报错
3,将对象的属性取出来,解构给已存在的变量,解构语句要用括号括起来,它和它的上一句,句尾都要加上分号

let name, age

const obj = {name: 'cc', age: 31};

({name, age} = obj);

经过测试,两个分号缺一个,都会报错。
4,嵌套解构。原对象和目标对象都存在时,能用嵌套解构给目标对象加属性。随时注意undefined的情况和分号。

let objCopy = {}

const obj = {name: 'cc', age: 31};

({name: objCopy.name, age: objCopy.age} = obj);

console.log(objCopy)

5, 部分解构。当解构进行中报错时,已经解构的部分会解构成功,报错之后的解构会失败。

const obj = {name: 'cc', age: 31};

const objCopy = {};

try {

({name: objCopy.name, cc: objCopy.cc, foo: {bar: six}, age: objCopy.age}= obj);

} catch (error) {

}

console.log(objCopy) // { name: 'cc', cc: undefined } age就没有被解构出来

6,参数的上下文匹配。解构时,不会影响arguments对象。

const obj = {name: 'cc', age: 31};

function getKey(str, {name, age}, boolean) {

console.log(arguments); // { '0': 'check', '1': { name: 'cc', age: 31 }, '2': true }

console.log( age, name); // 31 "cc"

}

getKey('check',obj, true)

后面会更新创建对象的几种模式。

javascript

阅读 9发布于 15 分钟前

本作品系原创,采用《署名-非商业性使用-禁止演绎 4.0 国际》许可协议

avatar

joychenke

业精于勤荒于嬉。加油ヾ(◍°∇°◍)ノ゙

40 声望

2 粉丝

0 条评论

得票时间

avatar

joychenke

业精于勤荒于嬉。加油ヾ(◍°∇°◍)ノ゙

40 声望

2 粉丝

宣传栏

这篇文章是看js红宝书后,记录的学习笔记。

对象属性:

访问器属性: 通过Object.defineProperty( ) 来设置。当获取属性时,会调用属性的获取方法get( );当设置属性时,会调用set( )
Object.defineProperties(obj, {}) 可以用来定义对象obj的对个属性。

Object.getOwnPropertyDescriptor(obj,key ) 方法获取对象obj指定属性key的属性描述符。Object.getOwnPropertyDescriptors(obj) 获取obj的所有属性。

实用的对象方法:

Object.assign(targetObj, obj1, obj2) 将obj1,obj2对象的属性混入到targetObj,Object.assign( )的返回值是对象targetObj,是浅复制。

Object.is(val1, val2) 和三等号基本保持一致,Object.is( )方法方便使用的场景是NaN的判断,比如:Object.is(NaN, parseInt('ss’)) 返回值是true

对象的几个增强语法:

1,属性的简写

const name = ‘cc'

const obj = {name}

2,可计算属性

const key = ‘xixi’

const obj = {[key]: ‘cc’}

3, 简写方法名,如 vue中methods定义的方法名。

对象解构:

1, 将对象的属性取出来,赋给一个全新变量
取的属性不存在时,值是undefined;可以给取的属性加默认值

const {name: objName, age: objAge} = {name: 'cc', age: 31}

console.log(objName,objAge) // 'cc' 31

2,给null和undefined解构,会报错
3,将对象的属性取出来,解构给已存在的变量,解构语句要用括号括起来,它和它的上一句,句尾都要加上分号

let name, age

const obj = {name: 'cc', age: 31};

({name, age} = obj);

经过测试,两个分号缺一个,都会报错。
4,嵌套解构。原对象和目标对象都存在时,能用嵌套解构给目标对象加属性。随时注意undefined的情况和分号。

let objCopy = {}

const obj = {name: 'cc', age: 31};

({name: objCopy.name, age: objCopy.age} = obj);

console.log(objCopy)

5, 部分解构。当解构进行中报错时,已经解构的部分会解构成功,报错之后的解构会失败。

const obj = {name: 'cc', age: 31};

const objCopy = {};

try {

({name: objCopy.name, cc: objCopy.cc, foo: {bar: six}, age: objCopy.age}= obj);

} catch (error) {

}

console.log(objCopy) // { name: 'cc', cc: undefined } age就没有被解构出来

6,参数的上下文匹配。解构时,不会影响arguments对象。

const obj = {name: 'cc', age: 31};

function getKey(str, {name, age}, boolean) {

console.log(arguments); // { '0': 'check', '1': { name: 'cc', age: 31 }, '2': true }

console.log( age, name); // 31 "cc"

}

getKey('check',obj, true)

后面会更新创建对象的几种模式。

以上是 【JS】对象的理解和解构赋值 的全部内容, 来源链接: www.h5w3.com/114970.html

回到顶部