console.log

promise

1、promise没有状态时其then（）不会调用

const promise = new Promise((resolve, reject) => {
  console.log(1);
  console.log(2);
});
promise.then(() => {
  console.log(3);
});
console.log(4);
1 
2 
4

2、直接输出promise，得到的是由其状态和结果构成的对象

promise1
1 Promise{<resolved>: resolve1}
2 Promise{<pending>}
resolve1

3、then方法接受的参数是函数，而如果传递的并非是一个函数，它实际上会将其解释为then(null)，这就会导致前一个Promise的结果会传递下面。.then 或.catch 的参数期望是函数，传入非函数则会发生值透传。

Promise.resolve(1)
  .then(2)
  .then(Promise.resolve(3))
  .then(console.log)
1

4、返回任意一个非 promise 的值都会被包裹成 promise 对象，因此这里的return new Error('error!!!')也被包裹成了return Promise.resolve(new Error('error!!!'))，因此它会被then捕获而不是catch。

Promise.resolve().then(() => {
  return new Error('error!!!')
}).then(res => {
  console.log("then: ", res)
}).catch(err => {
  console.log("catch: ", err)
})

"then: " "Error: error!!!"

---

async

await后面的语句相当于放到了new Promise中，下一行及之后的语句相当于放在Promise.then中。

const async1 = async () => {
  console.log('async1');
  setTimeout(() => {
    console.log('timer1')
  }, 2000)
  await new Promise(resolve => {
    console.log('promise1')
  })
  console.log('async1 end')
  return 'async1 success'
} 
console.log('script start');
async1().then(res => console.log(res));
console.log('script end');
Promise.resolve(1)
  .then(2)
  .then(Promise.resolve(3))
  .catch(4)
  .then(res => console.log(res))
setTimeout(() => {
  console.log('timer2')
}, 1000)

script start
async1
promise1
script end
1
timer2
timer1

---

this

1、this指向函数执行是的当前对象

function foo() {
  console.log( this.a );
}

function doFoo() {
  foo();
}

var obj = {
  a: 1,
  doFoo: doFoo
};

var a = 2; 
obj.doFoo()


2

foo只是函数，并不是对象，所以直接就this指向全局

2、箭头函数没有this，其this为父元素this

var a = 10
var obj = {
  a: 20,
  say: () => {
    console.log(this.a)
  }
}
obj.say() 

var anotherObj = { a: 30 } 
obj.say.apply(anotherObj) 

输出结果：10 10

此题，箭头函数中的this为obj所处的this。没有人调用obj所以是window

var a = 10  
var obj = {  
  a: 20,  
  say(){
    console.log(this.a)  
  }  
}  
obj.say()   
var anotherObj={a:30}   
obj.say.apply(anotherObj)


输出结果：20 30

这时，say方法中的this就会指向他所在的对象，输出其中的a的值。

一般是谁调用指向谁，如果取出来就指向window

call的参数啥都没写，就表示null，我们知道如果call的参数为undefined或null，那么this就会指向全局对象this

隐式调用失效

function foo() {
  console.log(this.name) // 小猪课堂
}


function doFoo(fn) {
  fn(); // 函数调用位置
}


let obj = {
  name: '张三',
  foo: foo
}
let name = '小猪课堂';
doFoo(obj.foo); // 小猪课堂
复制代码

上段代码中我们很容易会以为 foo 绑定的 this 是 obj 对象，因为我们使用了 obj.foo 的方式，这种方式就是遵循隐式绑定规则。但是事实上 this 却绑定到了全局对象上去，这是因为我们在 doFoo 函数中调用 fn 时，这里才是函数的实际调用位置，此时是独立函数调用，所以 this 指向了全局对象。

1. 默认绑定：无人调用，指向window
2. 隐式绑定：

   在隐式绑定规则中，我们认为谁调用了函数，this 就绑定谁，比如 obj.foo 中 this 就绑定到 obj，但是有一些情况比较特殊，即使采用的隐式绑定规则，但是 this 并没有按照我们的想法去绑定，这就是所谓的隐式绑定 this 丢失，常见于回调函数中。（看调用时的this，不往下追究）

3. 显式绑定：使用 call、apply 等方法

---

作用域/变量提升/闭包