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

2021-10-08 06:12:02 字數 3342 閱讀 2300

一、array 的擴充套件方法

擴充套件運算子（展開語法）

擴充套件運算子可以將陣列或者物件轉為用逗號分隔的引數序列

輸出結果沒有逗號，因為被當成引數分隔符

let ary =[1


,2,3


];...ary  // 1, 2, 3


console.


log(


...ary)


;// 1 2 3
擴充套件運算子可以應用於合併陣列

// 方法一


let ary1 =[1


,2,3


];let ary2 =[3


,4,5


];let ary3 =


[...ary1,


...ary2]


;//方法二


ary1.


push


(...ary2)


;
將類陣列或可遍歷物件轉換為真正的陣列

let odivs = document.


getelementsbytagname


('div');


odivs =


[...odivs]


;
例項方法：find()

用於找出第乙個符合條件的陣列成員，如果沒有找到返回undefined

let ary =[,


];let target = ary.


find


((item, index)


=> item.id ==2)


;
例項方法：findindex()

用於找出第乙個符合條件的陣列成員的位置，如果沒有找到返回 -1

let ary =[1


,5,10


,15];


let index = ary.


findindex


((value, index)


=> value >9)


;	condole.


log(index)


;// 2
例項方法：includes()

表示某個陣列是否包含給定的值，返回布林值。

[1,


2,3]


.includes(2


)// true[1


,2,3


].includes(4


)//  false

建構函式方法：array.from()

將類陣列或可遍歷物件轉換為真正的陣列

let arraylike =


;let arr2 = array.


from


(arraylike)


;// ['a', 'b', 'c']
方法還可以接受第二個引數，作用類似於陣列的map方法，用來對每個元素進行處理，將處理後的值放入返回的陣列

let arraylike =


let newary = array.


from


(arylike, item => item *


2)

二、string 的擴充套件方法

模板字串

es6新增的建立字串的方式，使用反引號定義

let name =


`zhangsan`


;
模板字串中可以解析變數

let name =


'zhangsan'


;let sayhello =


`hello,my name is $`


;//  hello,my name is zhangsan
模板字串中可以換行

let result =


let html =


`            $$


$       `
在模板字串中可以呼叫函式

const


sayhello


=function()


;let greet =`$


追不到我吧`


console.


log(greet)


;// 哈哈哈哈 追不到我吧

例項方法： startswith() 和 endswith()

let str =


'hello world'


;	str.


startswith


('hello'


)//true


str.


endswith


('!'


)//true

例項方法：repeat()

repeat方法表示將原字串重複n次，返回乙個新字串

'x'


.repeat(3


)//  "***"


'hello'


.repeat(2


)//   "hellohello"

三、資料結構

es6 提供了新的資料結構set。它類似於陣列，但是成員的值都是唯一的，沒有重複的值

set 本身是乙個建構函式，用來生成 set 資料結構

const s =


newset()


;
set 函式可以接受乙個陣列作為引數，用來初始化

const


set=


newset([


1,2,


3,4,


5,4]


);
會把重複的值過濾掉，可以利用這個進行陣列去重，輸出的陣列是去重之後的

例項方法

const s =


newset()


;	s.


add(1)


.add(2


).add(3)


;// 向 set 結構中新增值


s.delete(2


)//刪除 set 結構中的值


s.has(1


)//表示 set 結構中是否有1這個值 返回布林值


s.clear


()								清除 set 結構中的所有值

ES6 細化ES6之 物件的擴充套件

物件的屬性 屬性表示法es6 允許在大括號裡面，直接寫入變數和函式，作為物件的屬性和方法 es5 let name 張無忌 function sayme es5定義物件的屬性和方法的方式 var obj console.log obj.name 張無忌es6 let name 張無忌 functio...

ES6的物件擴充套件內容

1.屬性的簡潔表示方法 允許在物件之中，直接寫變數，這時，屬性名為變數名，屬性值為變數的值。function f x,y 等同於 function f1 x,y console.log f 1,2 2.除了屬性方法也可以簡寫 const o 等同於 const o commonjs 輸出變數適合使用...

ES6擴充套件的物件功能

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