对象 与 解构赋值

Posted GZGspring

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了对象 与 解构赋值相关的知识,希望对你有一定的参考价值。

对象

定义:在javascript中,对象就是拥有属性和方法的无需数据集合

创建对象:

1.object构造函数

var person=new object();

2.字面量方式

var person = {};

对象的属性:

对象属性的分类

1.数据属性:一般用于储存数据值

2.访问器属性:不包含数据值,多用于get/set操作

定义对象的数据属性

通过点运算符.来操作一个对象的属性

person.name="zhangsan";

通过方括号【】操作一个对象的属性

person["name"]="zhangsan";

删除对象的数据属性 :可以用delete操作符删除一个不是继承而来的属性

delete person.name;

对象的方法

定义对象的方法

方式一

var person={name:"lisi",sayname=function(){console.log("my name is"+this.name);}};

方式二

var person = new object();person.name=function(){console.log("my name is"+this.name);}

 

调用对象的方法

通过点运算符 . 来访问一个对象的方法

var person={name:"lisi",sayname=function(){console.log("my name is"+this.name);}};   person.sayname();

通过方括号 [] 来访问一个对象的方法

var person={name:"lisi",sayname=function(){console.log("my name is"+this.name);}};    person["sayname"]();

 

删除对象的方法

可以用 delete 操作符删除对象的方法

var person={name:"lisi",sayname=function(){console.log("my name is"+this.name);}};   delete person.sayname;

对象的遍历

1.for-in循环

for(let key in person){console.log(key);console.log(person[key]);}

 

2.object.keys(object)

var arr = object.keys(person);              for(let i=0;i<arr.length;i++){console.log(person[arr[i]]);}

 

3.Object.getOwnPropertyNames(object)

var arr = object.getownpropertynames(person);              for(let i=0;i<arr.length;i++){console.log(person[arr[i]]);}

解构赋值

数组的解构赋值

var a=1;var b=2;var c=3;       ===      let  [a,b,c]=[1,2,3];

嵌套数组的解构

数组解构的默认值

var  [a,b]=[];                vs            var [a=1,b=2]=[];

 

对象的解构赋值

var {name:name,age:age} = {name:“zhangsan”,age:20};
var {name,age} = {name:"zhangsan",age:20};

嵌套对象的解构

对象解构的默认值

var {name} = {};                 vs                 var {name="zhangsan"} = {};

 

函数参数的解构赋值

函数参数的解构赋值------参数默认值的解构赋值

参数为数组

function add([x=1,y=2]){return x+y;}   add([ ]) ;-----function add([x=1,y=2]=[ ]){return x+y;}add();

参数为对象

function test({name="zhangsan",age=20}){console.log(name,age)}  test({});   ----function test({name="zhangsan",age=20}={}){console.log(name,age)}  test( );                              

 

解构赋值的应用场景

1.交换变量的值

2.从函数返回多个值

3.函数参数的定义

4.函数参数的默认值

5.提取json数据

6.遍历 map 结构

7.输入模块的指定方法

以上是关于对象 与 解构赋值的主要内容,如果未能解决你的问题,请参考以下文章

es6 解构赋值

35.JavaScript对象和数组的解构赋值基础详解let陷阱函数参数解构

对象 与 解构赋值

ES6 对象的解构赋值

对象的解构赋值

变量的解构赋值 对象