ES6基礎(chǔ)語(yǔ)法之對(duì)象介紹
一、對(duì)象和屬性和方法
JavaScript中對(duì)象:
var person={name:"Jack",age:20};
或:
var name = "jack"; var age = 20; var person = {name:name,age:age}; console.log(person.age); //20
ES6中的簡(jiǎn)潔表示:
let [name,age]=["jack",20]; let person = {name,age}; //等同person = {name: name,age: age} console.log(person.age); //20
JavaScript中對(duì)象方法:
var person = { SayHi:function() { console.log("hi"); } } person.SayHi(); //hi
ES6中簡(jiǎn)潔表示:
let person = { SayHi() { console.log("hi"); } } person.SayHi();
ES6允許用表達(dá)式作為屬性名,但是一定要將表達(dá)式放在方括號(hào)內(nèi):
var person = {["na"+"me"]:"jack",["a"+"ge"]:20}; console.log(person.age);
或
let str = "Hi"; let person = { ["Say"+str](){ console.log("hi"); } } person.SayHi();
注意點(diǎn):屬性的簡(jiǎn)潔表示法和屬性名表達(dá)式不能同時(shí)使用,否則會(huì)報(bào)錯(cuò):
let [name,age]=["jack",20]; let person = {["na"+"me"],["a"+"ge"]}; //報(bào)錯(cuò)
二、對(duì)象的擴(kuò)展運(yùn)算符...
取出參數(shù)對(duì)象所有可遍歷屬性然后拷貝到當(dāng)前對(duì)象:
let stu1 = {name:"Jack",age:20,sex:"男"}; let stu2 = {...stu1}; console.log(stu2); //{name: "Jack", age: 20,sex:"男"}
合并兩個(gè)對(duì)象:
let stu1BasicInfo = {name:"Jack",age:20,sex:"男"}; let stu1DetailInfo = {phone:"13524521457",mail:"ldh@163.com"}; let stu = {...stu1BasicInfo,...stu1DetailInfo}; console.log(stu); //{name:"Jack",age:20,sex:"男",phone:"13524521457",mail:"ldh@163.com"}
拷貝對(duì)象時(shí)支持添加屬性:
let stu1 = {name:"Jack",age:20,sex:"男"}; let stu2 = {...stu1,phone:"13554785452"}; console.log(stu2); //{name:"Jack",age:20,sex:"男",phone:"13554785452"}
添加的屬性在拓展運(yùn)算符后面,取添加的屬性:
let stu1 = {name:"Jack",age:20,sex:"男"}; let stu2 = {...stu1,name:"rose",phone:"13554785452"}; console.log(stu2); //{name:"rose",age:20,sex:"男",phone:"13554785452"}
添加的屬性在拓展運(yùn)算度前面,取擴(kuò)展運(yùn)算符內(nèi)容:
let stu1 = {name:"Jack",age:20,sex:"男"}; let stu2 = {name:"rose",phone:"13554785452",...stu1}; console.log(stu2); //{name:"Jack",phone:"13554785452",age:20,sex:"男"}
到此這篇關(guān)于ES6基礎(chǔ)語(yǔ)法之對(duì)象的文章就介紹到這了。希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
javascript內(nèi)置對(duì)象arguments詳解
這篇文章主要介紹了javascript內(nèi)置對(duì)象arguments,實(shí)例講解arguments是什么怎么用,需要的朋友可以參考下2014-03-03深入解讀JavaScript中的Iterator和for-of循環(huán)
這篇文章主要介紹了JavaScript中的Iterator和for-of循環(huán),是JS入門學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-07-07javascript學(xué)習(xí)筆記_淺談基礎(chǔ)語(yǔ)法,類型,變量
下面小編就為大家?guī)?lái)一篇javascript學(xué)習(xí)筆記_淺談基礎(chǔ)語(yǔ)法,類型,變量。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2016-09-09Javascript學(xué)習(xí)筆記6 prototype的提出
所以你還會(huì)再說是否用prototype都是一樣的么?其實(shí)我以前也是這么理解的,在這次偶然的試驗(yàn)中看到了這個(gè)問題。2010-01-01