JavaScript對Object對象的一些經常使用操做總結。面試
1.能夠用做對象的複製segmentfault
var obj = { a: 1 }; var copy = Object.assign({}, obj); console.log(copy); // { a: 1 }
2.能夠用做對象的合併數組
var o1 = { a: 1 }; var o2 = { b: 2 }; var o3 = { c: 3 }; var obj = Object.assign(o1, o2, o3); console.log(obj); // { a: 1, b: 2, c: 3 } console.log(o1); // { a: 1, b: 2, c: 3 } 注意目標對象自身也會改變。
3.目標對象o1自身也發生了改變,假如不想讓o1改變,能夠把三個對象合併到一個空的對象中,操做以下:dom
var obj = Object.assign({},o1, o2, o3); console.log(obj); // { a: 1, b: 2, c: 3 } console.log(o1); // { a: 1 }
注意:如下幾個地方
1.繼承屬性和不可枚舉屬性是不能拷貝的this
var obj = Object.create({foo: 1}, { // foo 是個繼承屬性 bar: { value: 2 // bar 是個不可枚舉屬性。 }, baz: { value: 3, enumerable: true // baz 是個自身可枚舉屬性 } }); var copy = Object.assign({}, obj); console.log(copy); // { baz: 3 }
2.原始類型會被包裝爲 objectprototype
var v1 = "abc"; var v2 = true; var v3 = 10; var v4 = Symbol("foo") var obj = Object.assign({}, v1, null, v2, undefined, v3, v4); // 原始類型會被包裝,null 和 undefined 會被忽略 // 注意,只有字符串的包裝對象纔可能有自身可枚舉屬性 console.log(obj); // { "0": "a", "1": "b", "2": "c" }
Object.create()的不止是有一個參數,其實還有第二個參數!
Object.create(proto, [ propertiesObject ])第二個參數是可選的,主要用於指定咱們建立的對象的一些屬性,(例如:是否可讀、是否可寫,是否能夠枚舉等等)能夠經過下面案例來了解第二個參數!code
var o; o = Object.create(Object.prototype, { // foo會成爲所建立對象的數據屬性 foo: { writable:true, configurable:true, value: "hello" }, // bar會成爲所建立對象的訪問器屬性 bar: { configurable: false, get: function() { return 10 }, set: function(value) { console.log("Setting `o.bar` to", value) } }}) // 建立一個以另外一個空對象爲原型,且擁有一個屬性p的對象 o = Object.create({}, { p: { value: 42 } }) // 省略了的屬性特性默認爲false,因此屬性p是不可寫,不可枚舉,不可配置的 o.p = 24 o.p //42 o.q = 12 for (var prop in o) { console.log(prop) } //"q" delete o.p //false //建立一個可寫的,可枚舉的,可配置的屬性p o2 = Object.create({}, { p: { value: 42, writable: true, enumerable: true, configurable: true } });
用來判斷兩個值是不是同一個值。對象
下面是一些例子,面試中可能會說起繼承
Object.is('haorooms', 'haorooms'); // true Object.is(window, window); // true Object.is('foo', 'bar'); // false Object.is([], []); // false var test = { a: 1 }; Object.is(test, test); // true Object.is(null, null); // true // 特例 Object.is(0, -0); // false Object.is(-0, -0); // true Object.is(NaN, 0/0); // true Object.keys(obj)
返回一個由一個給定對象的自身可枚舉屬性組成的數組,數組中屬性名的排列順序和使用 for...in 循環遍歷該對象時返回的順序一致 (二者的主要區別是 一個 for-in 循環還會枚舉其原型鏈上的屬性)。ip
let arr = ["a", "b", "c"]; console.log(Object.keys(arr)); // ['0', '1', '2'] /* Object 對象 */ let obj = { foo: "bar", baz: 42 }, keys = Object.keys(obj); console.log(keys); // ["foo","baz"]
Object.keys返回一個數組,包括對象自身的(不含繼承的)全部可枚舉屬性(不含 Symbol 屬性)的鍵名。
// simple array var arr = ['a', 'b', 'c']; console.log(Object.keys(arr)); // console: ['0', '1', '2'] // array like object var obj = { 0: 'a', 1: 'b', 2: 'c' }; console.log(Object.keys(obj)); // console: ['0', '1', '2'] // array like object with random key ordering var anObj = { 100: 'a', 2: 'b', 7: 'c' }; console.log(Object.keys(anObj)); // console: ['2', '7', '100'] // getFoo is a property which isn't enumerable var myObj = Object.create({}, { getFoo: { value: function () { return this.foo; } } }); myObj.foo = 1; console.log(Object.keys(myObj)); // console: ['foo']
方法返回一個給定對象本身的全部可枚舉屬性值的數組,值的順序與使用for...in循環的順序相同 ( 區別在於 for-in 循環枚舉原型鏈中的屬性 )。 Object.values會過濾屬性名爲 Symbol 值的屬性。
var an_obj = { 100: 'a', 2: 'b', 7: 'c' }; console.log(Object.values(an_obj)); // ['b', 'c', 'a'] var obj = { 0: 'a', 1: 'b', 2: 'c' }; console.log(Object.values(obj)); // ['a', 'b', 'c']
返回一個給定對象自身可枚舉屬性的鍵值對數組,其排列與使用 for...in 循環遍歷該對象時返回的順序一致(區別在於 for-in 循環也枚舉原型鏈中的屬性)。
const obj = { foo: 'bar', baz: 42 }; console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ] const simuArray = { 0: 'a', 1: 'b', 2: 'c' }; console.log(Object.entries(simuArray)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]
1.刪除對象中的某個值,前面案例中也謝了能夠直接用delete
var obj = {b:123}; delete o.p // 或delete obj[b];
2.遍歷對象
2.1for-in遍歷
var obj = {a: 'ss', b: 'bb', c: 'cc'}; for (var i in obj){ console.log(i+':'+obj[i]); }
2.2forEach遍歷,先經過Object.keys()返回一個數組
Object.keys(obj).forEach((value, index)=>{ console.log(value, index,obj[value]); }); //等同於 Object.keys(obj).forEach(function (value, index,c) { console.log(value, index,obj[value]); });
2.3jQuery的$.each()方法:它接受兩個參數,分別指代屬性名和屬性值
$.each(obj,function(key,value){ console.log(key+": "+value)
1.Object.freeze() 方法能夠凍結一個對象,凍結指的是不能向這個對象添加新的屬性,不能修改其已有屬性的值,不能刪除已有屬性,以及不能修改該對象已有屬性的可枚舉性、可配置性、可寫性。也就是說,這個對象永遠是不可變的。該方法返回被凍結的對象。
2.Object.isFrozen() 方法判斷一個對象是否被凍結(frozen)。
3.Object.isExtensible() 方法判斷一個對象是不是可擴展的(是否能夠在它上面添加新的屬性)。
4.Object.isSealed() 方法判斷一個對象是不是密封的(sealed)。
5.Object.seal() 方法可讓一個對象密封,並返回被密封后的對象。密封對象是指那些不能添加新的屬性,不能刪除已有屬性,以及不能修改已有屬性的可枚舉性、可配置性、可寫性,但可能能夠修改已有屬性的值的對象。
6.Object.getOwnPropertyNames(obj)返回一個數組,包含對象自身的全部屬性(不含 Symbol 屬性,可是包括不可枚舉屬性)的鍵名。
7.Object.getOwnPropertySymbols(obj)返回一個數組,包含對象自身的全部 Symbol 屬性的鍵名。
8.Reflect.ownKeys(obj)返回一個數組,包含對象自身的全部鍵名,無論鍵名是 Symbol 或字符串,也無論是否可枚舉。
9.hasOwnProperty()判斷對象自身屬性中是否具備指定的屬性。