第JavaScript獲取對(duì)象key的幾種方法和區(qū)別目錄1、Object.keys()遍歷自身可以枚舉屬性2、Ojbect.values()/Ojject.entries()3、for-in遍歷可枚舉屬性prototype屬性4、hasOwnProperty遍歷可枚舉屬性5、getOwnPropertyNames()返回可枚舉屬性和不可枚舉屬性6、getOwnPropertySymbols()返回symbol類型的key屬性，7、對(duì)象對(duì)key的獲取方法8、對(duì)象聲明/對(duì)象賦值9、對(duì)象擴(kuò)展

1、Object.keys()遍歷自身可以枚舉屬性

letmyColors={

color1:'pink',

color2:'red'

};

letyourColors={

color3:'green',

color4:'blue'

};

Object.setPrototypeOf(yourColors,myColors);

//setPrototypeOf()設(shè)置一個(gè)指定的對(duì)象的原型到另一個(gè)對(duì)象orNULL

Object.keys(myColors);

Object.keys(yourColors);

console.log(myColors);

console.log(yourColors);

console.log(myColors['color1']);

console.log(yourColors['color3']);

解析：Object.keys(myColors)返回myColors對(duì)象的自身可枚舉屬性鍵；Object.keys(yourColors)也是返回yourColors對(duì)象自身的可枚舉屬性鍵。setPrototypeOf()方法讓yourColors繼承myColors原型的屬性，但是能看到并不能遍歷出來。Object.keys()是遍歷自身可以枚舉屬性。

2、Ojbect.values()/Ojject.entries()

返回自身可枚舉屬性的鍵值對(duì)數(shù)組：

letmyColors={

color1:'pink',

color2:'red'

};

letyourColors={

color3:'green',

color4:'blue'

};

Object.setPrototypeOf(yourColors,myColors);

console.log(Object.values(myColors));

console.log(Object.entries(myColors));

3、for-in遍歷可枚舉屬性prototype屬性

for-in遍歷對(duì)象所有的可枚舉屬性，包括原型。

ps：for-in和for-of的區(qū)別

①forin遍歷的是數(shù)組的索引（即鍵名），forof遍歷的是數(shù)組元素值

②forin得到對(duì)象的keyor數(shù)組or字符串的下標(biāo)

③forof得到對(duì)象的valueor數(shù)組or字符串的值

forin更適合遍歷對(duì)象

letmyColors={

color1:'pink',

color2:'red'

};

letyourColors={

color3:'green',

color4:'blue'

};

Object.setPrototypeOf(yourColors,myColors);

letarrayColors=[];

for(letkeyinyourColors){

arrayColors.push(key);

}

console.log(arrayColors);

解析：arrayColors數(shù)組包含yourColors自身屬性鍵，也有從原型對(duì)象myColrs繼承的屬性。

4、hasOwnProperty遍歷可枚舉屬性

返回一個(gè)布爾值，只能判斷自有屬性是否存在，對(duì)于繼承屬性會(huì)返回false，因?yàn)樗徊檎以玩湹暮瘮?shù)

//不使用hasOwnProperty，返回自身屬性和繼承原型屬性

letmyColors={

color1:'pink',

color2:'red'

};

letyourColors={

color3:'green',

color4:'blue'

};

Object.setPrototypeOf(yourColors,myColors);

for(letiinyourColors){

console.log(i);

}

//使用hasOwnProperty，返回自身屬性

letmyColors={

color1:'pink',

color2:'red'

};

letyourColors={

color3:'green',

color4:'blue'

};

Object.setPrototypeOf(yourColors,myColors);

for(letiinyourColors){

if(yourColors.hasOwnProperty(i)){//加上if判斷去掉原型鏈上的

console.log(i)

}

}

5、getOwnPropertyNames()返回可枚舉屬性和不可枚舉屬性

不包括prototype屬性，不包括symbol類型的key

getOwnPropertyNames()返回一個(gè)對(duì)象自身所有的屬性，包括可枚舉和不可枚舉屬性組成的數(shù)組

//返回對(duì)象自身所有的屬性，可枚舉和不可枚舉組成的數(shù)組，但不包括prototype屬性

letmyColors={

color1:'pink',

color2:'red'

};

letyourColors={

color3:'green',

color4:'blue'

};

Object.setPrototypeOf(yourColors,myColors);

//定義不可枚舉屬性

Object.defineProperty(yourColors,'your',{

enumerable:true,

value:6,

})

console.log(Object.getOwnPropertyNames(yourColors));

//返回對(duì)象自身所有的屬性，可枚舉和不可枚舉組成的數(shù)組，但不包括Symbol類型的key

let_item=Symbol('item')//定義Symbol數(shù)據(jù)類型

letmyColors={

color1:'pink',

color2:'red',

};

letyourColors={

color3:'green',

color4:'blue',

[_item]:'mySymbol'

};

Object.setPrototypeOf(yourColors,myColors);

//定義不可枚舉屬性

Object.defineProperty(yourColors,'your',{

enumerable:true,

value:6,

})

console.log(Object.getOwnPropertyNames(yourColors));

6、getOwnPropertySymbols()返回symbol類型的key屬性，

不關(guān)心是否可枚舉，返回對(duì)象自身的所有Symbol屬性組成的數(shù)組

let_item=Symbol('item')//定義Symbol數(shù)據(jù)類型

letmyColors={

color1:'pink',

color2:'red',

};

letyourColors={

color3:'green',

color4:'blue',

[_item]:'mySymbol'

};

Object.setPrototypeOf(yourColors,myColors);

//定義不可枚舉屬性

Object.defineProperty(yourColors,'your',{

enumerable:true,

value:6,

})

console.log(Object.getOwnPropertySymbols(yourColors));

7、對(duì)象對(duì)key的獲取方法

functiongetkey(){

letobj={

a:1,

b:2,

c:3

};

Ototype.d=4;

Object.defineProperty(obj,'e',{

configurable:true,

writable:false,

enumerable:false,

value:5

});

Object.defineProperty(obj,'f',{

configurable:true,

writable:false,

enumerable:true,

value:6

});

constsymbolg=Symbol('g');

constsymbolh=Symbol('h');

Object.defineProperty(obj,symbolg,{

configurable:true,

writable:false,

enumerable:false,

value:7

});

Object.defineProperty(obj,symbolh,{

configurable:true,

writable:false,

enumerable:true,

value:8

});

console.log();

for(letkeyinobj){

console.log('--for-in:',key);

if(obj.hasOwnProperty(key)){

console.log('--hasOwnProperty:',key);

}

}

console.log('--getOwnPropertyNames:',Object.getOwnPropertyNames(obj));

console.log('--getOwnPropertyDescriptor:',Object.getOwnPropertyDescriptor(obj));

console.log('--getOwnPropertySymbols:',Object.getOwnPropertySymbols(obj));

console.log('--keys:',Object.keys(obj));

}

--for-in:a

--hasOwnProperty:

a

--for-in:b

-