1. 程式人生 > >prototype與for in

prototype與for in

完全 得到 con for word RR Language dex iter

《一》prototype
prototype其實是函數的一個屬性,並且只有函數有這個屬性,這個屬性就是給函數增加函數或者屬性的,比如寫一個
function one(){},那麽one.prototype的類型就是一個對象,使用JSON.stringify(one.prototype)得到的就是一個字符串類型的{}了,顯然是一個空的對象。
我添加一個name屬性試試,one.prototype.name="這是文本",再JSON.stringify(one.prototype)得到:{‘name’:‘這是文本‘}。
《二》for in
這個遍歷數組或者對象,首先得到的是索引或者是key值,比如
var arr=[3,4,1];
for(var index in arr){
console.log(index)//1,2,3
console.log(arr[index])//3,4,1
}
var obj={name:‘wang‘,age:11};
for(var index in obj){
console.log(index);//name,age
console.log(obj(index);//wang,11
}
而of是直接獲取值了。
再補充其他幾種循環遍歷的方法:

數組原生具備iterator接口(即默認部署了Symbol.iterator屬性),for...of循環本質上就是調用這個接口產生的遍歷器,可以用下面的代碼證明。

const arr = [‘red‘, ‘green‘, ‘blue‘];

for(let v of arr) {
  console.log(v); // red green blue
}

const obj = {};
obj[Symbol.iterator] = arr[Symbol.iterator].bind(arr);

for(let v of obj) {
  console.log(v); // red green blue
}

上面代碼中,空對象obj部署了數組arrSymbol.iterator屬性,結果objfor...of循環,產生了與arr完全一樣的結果。

for...of循環可以代替數組實例的forEach方法。

const arr = [‘red‘, ‘green‘, ‘blue‘];

arr.forEach(function (element, index) {
  console.log(element); // red green blue
  console.log(index);   // 0 1 2
});

JavaScript 原有的for...in循環,只能獲得對象的鍵名,不能直接獲取鍵值。ES6 提供for...of

循環,允許遍歷獲得鍵值。

var arr = [‘a‘, ‘b‘, ‘c‘, ‘d‘];

for (let a in arr) {
  console.log(a); // 0 1 2 3
}

for (let a of arr) {
  console.log(a); // a b c d
}

上面代碼表明,for...in循環讀取鍵名,for...of循環讀取鍵值。如果要通過for...of循環,獲取數組的索引,可以借助數組實例的entries方法和keys方法(參見《數組的擴展》一章)。

for...of循環調用遍歷器接口,數組的遍歷器接口只返回具有數字索引的屬性。這一點跟for...in循環也不一樣。

let arr = [3, 5, 7];
arr.foo = ‘hello‘;

for (let i in arr) {
  console.log(i); // "0", "1", "2", "foo"
}

for (let i of arr) {
  console.log(i); //  "3", "5", "7"
}

上面代碼中,for...of循環不會返回數組arrfoo屬性。



prototype與for in