ES6中對象、函數、數組的擴展

W_BinaryTree 發布于2019-08-26 10:47 / 1358人閱讀

摘要：對象判斷兩個參數的值是否全等與類似不過區別在于返回返回用于對象的合并將參數中所有可枚舉的屬性復制到目標對象返回目標對象若有相同的屬性值后面的會覆蓋之前的值傳入一個對象返回一個數組包含對象中所有可遍歷的屬性的鍵名傳入一個對象返回一個數組包含

對象

Object.is(value1,value2)

判斷兩個參數的值是否全等,與 === 類似,不過區別在于 Object.is(+0, -0)返回false, Object.is(NaN, NaN)返回true

    Object.is("foo","foo") //true
    Object.is({},{}) //false

Object.assign(target,o1,o2...)

用于對象的合并將參數中所有可枚舉的屬性復制到目標對象target,返回目標對象
若有相同的屬性值,后面的會覆蓋之前的值

const target = {a:1, b:2, c:3}
const o1 = {b:4, d:5}
const newTarget = Object.assign(target, o1)

console.log(target) //{a:1, b:4, c:3, d:5}
console.log(Object.is(target,newTarget)) //true

Object.keys(obj)

傳入一個對象返回一個數組,包含對象中所有可遍歷的屬性的鍵名

const obj = {name: "lil", age: 3}
console.log(Object.keys(obj)) //[ "name", "age" ]

Object.values(obj)

傳入一個對象返回一個數組,包含對象中所有可遍歷的屬性的鍵值

const obj = {name: "lil", age: 3}
console.log(Object.values(obj)) //[ "lil", 3 ]

Object.entries(obj)

傳入一個對象返回一個數組,包含對象中所有可遍歷的屬性的鍵值對

const obj = {name: "lil", age: 3}
console.log(Object.entries(obj))
//[ [ "name", "lil" ], [ "age", 3 ] ]

Object.setPrototypeOf(obj,prototype)

用來設置對象的prototype對象,返回參數對象本身,這個方法是ES6
正式推薦的設置原型對象的方法,等同于

function foo(obj,proto) {
    obj.__proto__ = proto;
    return obj
}

Object.getPrototypeOf(obj)

傳入對象獲取對象的原型對象

函數

rest參數

reset用來獲取函數多余的參數,將多余的參數放入數組中,可調用數組的方法

function foo(...rest) {
  return rest
}
console.log(foo(1,2,3)) //[1,2,3]

數組

擴展運算符

擴展運算符表示為...,可理解為rest參數的逆運算
擴展運算符將一個數組轉為用逗號隔開的參數序列

const arr = [1,2,3,4]
console.log(arr) //1 2 3 4

將字符串轉換為數組

console.log([..."hello"]) //[ "h", "e", "l", "l", "o" ]

合并數組

const arr1 = [1,2,3]
const arr2 = [4,5,6]
const arr3 = [...arr1,...arr2]
console.log(arr3) //[ 1, 2, 3, 4, 5, 6 ]

Array.from()

用于將類數組或者可遍歷的對象轉為數組

const obj = {"0":"a","1":"b","2":"c",length:3}
console.log(Array.from(obj)) //[ "a", "b", "c" ]

console.log(Array.from("hello"))//[ "h", "e", "l", "l", "o" ]

Array.of()

將一組值轉換為數組,彌補了Array()的不足之處

Array.of(1,2,3) //[1, 2, 3]
Array(1,2,3) //[1, 2, 3]

Array.of(3) //[3]
Array(3) //[, , ,]

find()

返回數組中滿足回調函數的第一個的值,全都不滿足則返回undefined

const arr = [1, 2, 30, 100, 60]
const result = arr.find(item => item > 30)
console.log(result) //100

findIndex()

與find()用法類似,返回值為滿足回調函數的第一個值的下標
全都不滿足則返回undefined

const arr = [1, 2, 30, 100, 60]
const result = arr.findIndex(item => item > 30)
console.log(result) //3

entries()

用于遍歷數組,返回一個遍歷器對象Object [Array Iterator]{}
可用for...of進行循環遍歷

const arr = ["a", "b", "c"]
for (let [index, item] of arr.entries()) {
    console.log(index, item)
}
//0 "a"
//1 "b"
//2 "c"

keys()

用法與entries()一樣,區別在于keys()是對鍵名進行遍歷而entries()
是對鍵值對進行遍歷

const arr = ["a", "b", "c"]
for (let index of arr.keys()) {
    console.log(index)
}

includes()

發方法返回布爾值,檢測數組是否包含某個值

const arr = [1,2,"a",NaN]
arr.includes(1) //true
arr.includes(3) //false
arr.includes("a") //true
arr.includes(NaN) //true

GPU云服務器云服務器 es6字符串擴展對象的擴展匹配對象的屬性和函數 php的對象轉數組

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/106774.html

ES6 ...操作符

摘要：在語法中，操作符有兩種意義剩余語法，參數和展開語法，展開數組對象，作為函數數組對象的擴展運算符。使用和參數進行操作其余參數傳給原始函數展開語法運算則可以看作是參數的逆運算。在ES6語法中，...操作符有兩種意義：rest(剩余語法，rest參數) 和 spread(展開語法，展開數組/對象)，作為函數、數組、對象的擴展運算符。從某種意義上說，剩余語法與展開語法是相反的：剩余語法將多...

MorePainMoreGain 2019-08-23 12:12 評論0 收藏0
《ES6標準入門》讀書筆記

摘要：標準入門讀書筆記和命令新增命令，用于聲明變量，是塊級作用域。用于頭部補全，用于尾部補全。函數調用的時候會在內存形成一個調用記錄，又稱為調用幀，保存調用位置和內部變量等信息。等到執行結束再返回給，的調用幀才消失。《ES6標準入門》讀書筆記 @(StuRep) showImg(https://segmentfault.com/img/remote/1460000006766369?w=3...

HollisChuang 2019-08-19 18:41 評論0 收藏0
ES6的rest參數和擴展運算符

摘要：參數的形式為變量名擴展運算符是三個點。傳遞給函數的一組參數值，被整合成了數組。擴展運算符的應用普通的函數調用上面代碼中，和這兩行，都是函數的調用，它們的都使用了擴展運算符。這時，擴展運算符可以將其轉為真正的數組，原因就在于對象實現了。 rest參數和擴展運算符都是ES6新增的特性。rest參數的形式為：...變量名；擴展運算符是三個點（...）。 rest參數 rest參數用于獲取函數...

ccj659 2019-08-20 18:05 評論0 收藏0
ES6學習總結（1）

摘要：返回一個對象，遍歷對象自身和繼承的所有可枚舉屬性不含，與相同和在紅寶書中就已經提到過屬性，表示的是引用類型實例的一個內部指針，指向該實例的構造函數的原型對象。半個月前就決定要將ES6的學習總結一遍，結果拖延癥一犯，半個月就過去了，現在補起來，慚愧慚愧。阮一峰的《ES6標準入門》這本書有300頁左右，除了幾個新的API和js語法的擴展,真正有價值的內容并不多。所謂存在即合理，每部分的...

happyfish 2019-08-20 15:38 評論0 收藏0
ES6學習手稿之基本類型擴展

摘要：它是一個通用標準，奠定了的基本語法。年月發布了的第一個版本，正式名稱就是標準簡稱。結語的基本擴展還有一些沒有在這里詳細介紹。前言 ES6標準以及頒布兩年了，但是，好像還沒有完全走進我們的日常開發。這篇文章從ES6的基本類型擴展入手，逐步展開對ES6的介紹。 ECMAScript和JavaScript JavaScript是由Netscape創造的，該公司1996年11月將JavaSc...

tommego 2019-08-21 18:25 評論0 收藏0
ES6 知識整理一（es6快速入門）

摘要：函數調用會在內存形成一個調用記錄，又稱調用幀，保存調用位置和內部變量等信息。等到運行結束，將結果返回到，的調用幀才會消失。方法用于將一組值，轉換為數組。，和遍歷數組方法返回一個布爾值，表示某個數組是否包含給定的值，與字符串的方法類似。 ES6 簡介 ES6，全稱 ECMAScript 6.0 ，是 JavaScript 的下一個版本標準，2015.06 發版。 let 和 const...

elva 2019-08-26 13:36 評論0 收藏0