成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

ECMAScript6 新特性——“對(duì)象的擴(kuò)展”

Clect / 765人閱讀

摘要：屬性的簡潔表示法允許直接寫入變量和函數(shù)作為對(duì)象的屬性和方法。，中有返回一個(gè)數(shù)組，成員是參數(shù)對(duì)象自身的不含繼承的所有可遍歷屬性的鍵名。對(duì)象的擴(kuò)展運(yùn)算符目前，有一個(gè)提案，將解構(gòu)賦值擴(kuò)展運(yùn)算符引入對(duì)象。

1 屬性的簡潔表示法

ES6允許直接寫入變量和函數(shù)作為對(duì)象的屬性和方法。

寫入屬性

var name = "value";
var obj = {
    name
};
console.log(obj.name); //value

寫入方法

var func = function(){return "function"};
var obj = {
    func
};
console.log(obj.func()); //function

舉個(gè)例子：

let name = "Oliver";
let sayName = function() {
    console.log(this.name);
};
let person = {
    name,
    sayName
};
console.log(person.name); //Oliver
person.sayName(); //Oliver

傳統(tǒng)的寫法：

let person = {
    name: "Oliver",
    sayName: function() {
        console.log(this.name);
    }
};
console.log(person.name); //Oliver
person.sayName(); //Oliver

不用必需填寫屬性的值

function log(x, y) {
    return {x, y};
}
console.log(log(1, 2)); //Object {x: 1, y: 2}

傳統(tǒng)的寫法：

function log(x, y) {
    return {x: x, y: y};
}
console.log(log(1, 2)); //Object {x: 1, y: 2}

需要注意的是這種寫法中的屬性名總是字符串。

2 屬性名表達(dá)式

JavaScript語言定義對(duì)象的屬性，有兩種方法:

var o = {};
function f() {return "boo" + "lean";}
o.bool = true; //方法一
o[f()] = false; //方法二
console.log(o); //Object {bool: true, boolean: false}

但是在字面亮方式定義對(duì)象的時(shí)候只能使用方法一：

var o = {
    bool: true
};
console.log(o); //Object {bool: true}

ES6支持使用方法二：

function f() {
    return "bool" + "ean";
}
var o = {
    bool: true,
    [f()]: false
};
console.log(o); //Object {bool: true, boolean: false}
3 方法的name屬性

函數(shù)的name屬性返回函數(shù)名，對(duì)象方法也是函數(shù)，因此也有name屬性。

4 Object.is()

該方法與（===）基本一致，不同的是＋0不等于－0，NaN等于自身：

console.log(NaN === NaN); //false
console.log(Object.is(NaN, NaN)); //true
console.log(+0 === -0); //true
console.log(Object.is(+0, -0)); //false
5 Object.assign()

用來將源對(duì)象（source）的所有可枚舉屬性復(fù)制到目標(biāo)對(duì)象（target），第一個(gè)參數(shù)為目標(biāo)對(duì)象，之后的參數(shù)都是源對(duì)象

var o1 = {
    a: 1
};
var o2 = {
    b: 2,
    c: 3
};
Object.assign(o1, o2);
console.log(o1); //Object {a: 1, b: 2, c: 3}

同名屬性，后面的會(huì)覆蓋前面的：

var o1 = {
    a: 1
};
var o2 = {
    a: 2,
    b: 3
};
Object.assign(o1, o2);
console.log(o1); //Object {a: 2, b: 3}

嵌套對(duì)象，處理方法是替換，而不是添加：

var o1 = {
    a: {
        b: 1,
        c: 2
    },
    d: 1
};
var o2 = {
    a: {
        b: "str"
    },
    d: 4
};
Object.assign(o1, o2);
console.log(o1);
//Object {a: Object, d: 4}
    //a:Object
        //b:"str"
    //__proto__:Object
    //d:4
//__proto__:Object

數(shù)組，處理方法是視為對(duì)象：

var a = [1, 2, 3, 4, 5];
var b = [2, 0];
Object.assign(a, b);
console.log(a); //[2, 0, 3, 4, 5]
6 屬性的遍歷

ES6一共有6種方法可以遍歷對(duì)象的屬性。

for...in: for...in循環(huán)遍歷對(duì)象自身的和繼承的可枚舉屬性（不含Symbol屬性）。

Object.keys(obj): Object.keys返回一個(gè)數(shù)組，包括對(duì)象自身的（不含繼承的）所有可枚舉屬性（不含Symbol屬性）。

Object.getOwnPropertyNames(obj): Object.getOwnPropertyNames返回一個(gè)數(shù)組，包含對(duì)象自身的所有屬性（不含Symbol屬性，但是包括不可枚舉屬性）。

Object.getOwnPropertySymbols(obj): Object.getOwnPropertySymbols返回一個(gè)數(shù)組，包含對(duì)象自身的所有Symbol屬性。

Reflect.ownKeys(obj): Reflect.ownKeys返回一個(gè)數(shù)組，包含對(duì)象自身的所有屬性，不管是屬性名是Symbol或字符串，也不管是否可枚舉。

Reflect.enumerate(obj): Reflect.enumerate返回一個(gè)Iterator對(duì)象，遍歷對(duì)象自身的和繼承的所有可枚舉屬性（不含Symbol屬性），與for...in循環(huán)相同。

以上的6種方法遍歷對(duì)象的屬性，都遵守同樣的屬性遍歷的次序規(guī)則。

首先遍歷所有屬性名為數(shù)值的屬性，按照數(shù)字排序。

其次遍歷所有屬性名為字符串的屬性，按照生成時(shí)間排序。

最后遍歷所有屬性名為Symbol值的屬性，按照生成時(shí)間排序。

7 Object.getPrototypeOf()和Object.setPrototypeOf()

盡量避免使用__proto__獲取prototype。

而是使用下面的Object.setPrototypeOf()（寫操作）、Object.getPrototypeOf()（讀操作）、Object.create()（生成操作）代替。

var o = {
    name: "Oliver",
    age: 18
};
var proto = {};
Object.setPrototypeOf(o, proto);

proto.getName = function() {
    return this.name;
};

console.log(o.getName()); //Oliver
console.log(Object.getPrototypeOf(o));
//Object {} getName : () __proto__ : Object
8 ES7:Object.values()，Object.entries()

ES5中有Object.keys返回一個(gè)數(shù)組，成員是參數(shù)對(duì)象自身的（不含繼承的）所有可遍歷（enumerable）屬性的鍵名。

var o = {
    name: "Oliver",
    age: 18
};
console.log(Object.keys(o)); //["name", "age"]

ES7提案或?qū)⒓尤隣bject.values()，Object.entries()兩個(gè)方法

類似數(shù)組的上述幾種方法。

9 ES7:對(duì)象的擴(kuò)展運(yùn)算符

目前，ES7有一個(gè)提案，將Rest解構(gòu)賦值/擴(kuò)展運(yùn)算符（...）引入對(duì)象。

10 ES7:Object.getOwnPropertyDescriptors()

ES5中有Object.getOwnPropertyDescriptor();

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/79184.html

相關(guān)文章

  • ECMAScript6 新特性——“數(shù)值的擴(kuò)展”

    摘要：二進(jìn)制和八進(jìn)制表示法提供了二進(jìn)制和八進(jìn)制數(shù)值的新的寫法，分別用前綴或和或表示。用來檢查是否為有窮以及是否為這兩個(gè)新方法只對(duì)數(shù)值有效，非數(shù)值一律返回。引入了和這兩個(gè)常量，用來表示這個(gè)范圍的上下限。因?yàn)橛芯认拗?，超過的次方的值無法精確表示。 1 二進(jìn)制和八進(jìn)制表示法 ES6提供了二進(jìn)制和八進(jìn)制數(shù)值的新的寫法，分別用前綴0b（或0B）和0o（或0O）表示。 console.log(0b10...

    Dean 評(píng)論0 收藏0

  • ECMAScript6 新特性——“l(fā)et和const命令”

    摘要：基本用法所聲明的變量，只在命令所在的代碼塊內(nèi)有效。在循環(huán)中適合使用不存在變量提升不像那樣會(huì)發(fā)生變量提升現(xiàn)象暫時(shí)性死區(qū)只要塊級(jí)作用域內(nèi)存在命令，它所聲明的變量就綁定這個(gè)區(qū)域，不再受外部的影響。塊級(jí)作用域?qū)嶋H上為新增了塊級(jí)作用域。 1 let 基本用法 所聲明的變量，只在let命令所在的代碼塊內(nèi)有效。 { let b = 100; console.log(b); //100...

    PascalXie 評(píng)論0 收藏0

  • ECMAScript6 新特性——“正則的擴(kuò)展”

    摘要：第二個(gè)參數(shù)指定修飾符，如果存在則使用指定的修飾符。屬性表示是否設(shè)置了修飾符屬性的屬性返回正則表達(dá)式的正文的屬性返回正則表達(dá)式的修飾符字符串必須轉(zhuǎn)義，才能作為正則模式。 1 RegExp構(gòu)造函數(shù) ES6 允許RegExp構(gòu)造函數(shù)接受正則表達(dá)式作為參數(shù)。第二個(gè)參數(shù)指定修飾符，如果存在則使用指定的修飾符。 var regexp = new RegExp(/xyz/i, ig); consol...

    Shisui 評(píng)論0 收藏0

  • ECMAScript6 新特性——“變量的解構(gòu)賦值”

    摘要：數(shù)組的解構(gòu)賦值允許按照一定模式，從數(shù)組和對(duì)象中提取值，對(duì)變量進(jìn)行賦值，這被稱為解構(gòu)。如果變量名與屬性名不一致，必須寫成下面這樣。 1 數(shù)組的解構(gòu)賦值 ES6允許按照一定模式，從數(shù)組和對(duì)象中提取值，對(duì)變量進(jìn)行賦值，這被稱為解構(gòu)（Destructuring）。 基本用法 { var [a,[b,c],d,,...f] = [1,[2,3],4,5,6,7]; console...

    Eric 評(píng)論0 收藏0

  • ECMAScript6 新特性——“字符串的擴(kuò)展”

    摘要：吉字符串的遍歷器接口為字符串添加了遍歷器接口，使得字符串可以被循環(huán)遍歷。提供字符串實(shí)例的方法，用來將字符的不同表示方法統(tǒng)一為同樣的形式，這稱為正規(guī)化。返回布爾值，表示參數(shù)字符串是否在源字符串的頭部。 1 字符串的Unicode表示法 ES6 只要將碼點(diǎn)放入大括號(hào)，就能正確解讀該字符； var x = u20bb7; document.write(x); //?7 var x = u{2...

    BlackMass 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<