prototype与for in

Posted 2020-10-29 sweeeper

《一》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部署了数组arr的Symbol.iterator属性，结果obj的for...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循环不会返回数组arr的foo属性。