ES6學習筆記 擴充套件的物件功能 解構

2021-08-28 13:57:17 字數 1951 閱讀 5087

以下內容整理自 阮一峰 的《ecmascript 6 入門》 第三章、一些其他網路資源及帥氣博主的自我理解。

在es5中,我們對於物件都是以鍵值對的形式書寫,是有可能出現鍵值對重名的情況

function people(name,age)

}

鍵值對重名,es6可以簡寫成以下:

function people(name,age)

}

es6同樣改進了為物件字面量方法賦值的語法。

es5為物件新增方法:

const people = 

}

es6通過省略冒號與funciton關鍵字,讓其變得更整潔。

不過話說回來,我真心覺得es6對function這個關鍵字有著殺父之仇,能弄掉的地方全拿掉了。

const people = 

}

es6淺拷貝 object.assign()

object.assign()可以把任意多個源物件自身可列舉的屬性拷貝給目標物件,然後返回目標物件。第一引數即為目標物件。在實際專案中,我們為了不改變源物件,一般會把目標物件傳為{}

const obja = 

const objb =

const objc = {} // 這個為目標物件

const obj = object.assign(objc,obja,objb)

//我們來把 這幾個變數輸出來看看

console.log(obja) //

console.log(objb) //

console.log(objc) //

console.log(obj) //

//我們發現,目標物件objc的值也被改變了。

//so,如果objc也是你的乙個源物件的話。請在objc前面填在乙個目標物件{}

const obj = object.assign({},objc,objb,obja)

陣列和物件是js中最常用的表示形式。為了簡化提取資訊,es6新增了解構,它能夠按照一定的模式,從陣列和物件中提取值,對變數進行賦值。

在es5中我們提取物件中的資訊形式如下:

const people = 

const name = people.name

const age = people.age

console.log(name + ' --- ' + age)

也就是說在es5中,我們只能乙個乙個獲取。

但是有了解構,就能讓我們從物件或者陣列中取出資料存為變數。

//物件

const people =

const = people

console.log(`$ --- $`)

//陣列

const color = ['red','blue']

const [first, second] = color

console.log(first)

console.log(second)

老鐵,整兩道測試題吧

// 請使用 es6 重構一下**

// 第一題

var jsonparse = require('body-parser').jsonparse

// 第二題

var body = request.body

var username = body.username

var password = body.password

1.import  from 'body-parser'

2. const } = request

ES6學習 擴充套件的物件功能

物件類別 2.使用方法 es6之前 function person name,age es6 function person name,age es6之前 var person es6 var person console.log object 5,5 false console.log objec...

ES6擴充套件的物件功能

在es5及更早版本中,物件字面量是 鍵 值對 的簡單集合。這意味著在屬性值被初始化時可 能會有些重複,例如 可以像這樣用es6重寫 es6同樣改進了為物件字面量方法賦值的語法。在es5及更早版本中,你必須指定乙個名稱 並用完整的函式定義來為物件新增方法,如下 通過省略冒號與function關鍵字,e...

ES6的內建物件擴充套件 筆記

一 array 的擴充套件方法 擴充套件運算子 展開語法 擴充套件運算子可以將陣列或者物件轉為用逗號分隔的引數序列 輸出結果沒有逗號,因為被當成引數分隔符 let ary 1 2,3 ary 1,2,3 console.log ary 1 2 3擴充套件運算子可以應用於合併陣列 方法一 let ar...