Javascript整理

Javascript基础

作用域，作用域链，闭包

执行环境，一个变量可以被使用的范畴叫做作用域

// 作用域
{
  let a = 10;
  let b = 11;
}

// 作用域链
function  bar (){
  let key = 100
  function foo(){
    // 当查找key的时候在 foo这个使用域的范围内是没有这声名这个变量的，所以需要向父级作用域查找
    console.log("key:" + key)
  }
  foo();
}

graph LR

B(一个内部作用域)
A1[let a = 10] -->B
A2[let b = 11] -->B


bar(一个函数bar)
foo(一个函数foo)
console(调用key)
bar -->|key=100| foo

foo -->|console.log,key| console -->bar

原型，原型链，继承

什么原型？

1. 构造函数
2. 原型
3. 实例

什么是原型链？

对象上的属性查找方式

• 在实例自身上查找属性
• 当实例自身查找不到时，在实例的原型上查找（__ proto __ ）

继承的方式

动物父类

function Animal(name){
  this.name = name
}

Animal.prototype.run = function(){
  console.log('Animal can run')
}

Animal.prototype.sleep = function(){
  console.log('Animal can sleep')
}

原型链继承

function Cat (){
}
Cat.prototype = new Animal('cat')
Cat.prototype.constructor = Cat;
let cat = new Cat();

寄生方式继承

function Cat (name){
  Animal.bind(this, name)
  run.bind(this)
  sleep.bind(this)
}
let cat = new Cat('cat');

组合方式

function Cat (name){
  Animal.bind(this, name)
}
Cat.prototype = new Animal('cat')
Cat.prototype.constructor = Cat;
let cat = new Cat('cat');

EventLoop

1. 调用栈
2. 宏观任务队列
3. 微观任务队列

宏观任务

• script 标签
• setTimeout
• setInterval
• Ajax: feth xmlhttpRequest
• setImmdite
• I/O
• Dom 事件

微观任务

• Primose
• Async Awaite
• yidle *

迭代协议

可迭代协议

要成为可迭代对象， 一个对象必须实现 @@iterator 方法。

迭代器协议

迭代器协议定义了产生一系列值（无论是有限个还是无限个）的标准方式。当值为有限个时，所有的值都被迭代完毕后，则会返回一个默认返回值。

只有实现了一个拥有以下语义（semantic）的 next() 方法，一个对象才能成为迭代器

属性	值
next	一个无参数函数，返回一个应当拥有以下两个属性的对象：done（boolean）如果迭代器可以产生序列中的下一个值，则为 false。（这等价于没有指定 done 这个属性。）如果迭代器已将序列迭代完毕，则为 true。这种情况下，value 是可选的，如果它依然存在，即为迭代结束之后的默认返回值。value迭代器返回的任何 JavaScript 值。done 为 true 时可省略。next() 方法必须返回一个对象，该对象应当有两个属性： done 和 value，如果返回了一个非对象值（比如 false 或 undefined），则会抛出一个 TypeError 异常（"iterator.next() returned a non-object value"）。

Javascript开发