1.注意项

使用函数名只会访问函数指针，不会执行函数const fun = add 与 const fun = add()

2. 箭头函数

箭头函数不能使用arguments（扩展操作符），没有prototype属性

3. 函数默认值

  1. // 给参数传undefined时，会使用默认值
  2. function makeKing(name = 'Henry', numerals = 'VIII') { 
  3.  console.log(`King ${name} ${numerals}`);
  4. }
  5. makeKing(undefined, 'I') //King Henry I

4. arguments对象

  1. // arguments对象是一个类数组对象（但不是Array实例对象）,可以弥补没有函数重载的缺陷
  2. // arguments对象有length属性
  3. function add(){
  4.   console.log(arguments)
  5.   // 使用length属性获取长度
  6.   console.log(arguments.length)
  7. }
  9. add('a','b') 
  10. // {"0": "a", "1": "b"} 
  11. // 2

5. this指向问题

this是函数执行的上下文，引用的是把函数当成方法调用的上下文对象
this指向问题.webp

6. apply()、call()、bind()

  1. function sum(num1, num2) { 
  2.  return num1 + num2; 
  3. }
  5. // apply() 改变this指向并调用函数
  6. // 接收2个参数：参数1: this对象，参数2:Array实例或arguments对象
  7. function applySum(num1, num2) { 
  8.  return sum.apply(this, [num1,num2]); // 或者直接传入 arguments 对象
  9.  // return sum.apply(this, arguments);
  10. }
  12. // call()作用与apply()一样
  13. // 接收多个参数：参数1: this对象，后面参数：调用函数需要的参数
  14. // 用哪个？ 想一个个传参就用call，想用数组方式传参就用apply
  15. function callSum(num1, num2) { 
  16.     return sum.call(this, num1, num2); 
  17. }    
  19. // bind 只会改变this，不会调用函数
  20. function sayColor() { 
  21.  console.log(this.color); 
  22. }
  24. const obj = {color: 'red'}
  25. const bindSum = sayColor.bind(obj) 
  26. bindSum() // red

7. 函数声明与函数表达式

函数声明与函数表达式.png

  1. // 函数声明有提升，函数表达式没有提升，类似于let与var的暂时死区
  2. // 函数声明
  3. function sum() { }
  5. // 函数表达式
  6. let sum = function(){ }

8. 立即调用函数

  1. (function() { 
  2.  // 块级作用域
  3. })();

9. 构造函数

使用new操作符调用构造函数，不使用调用普通函数

对象的创建过程

  1. 在内存中创建一个空对象
  2. 这个空对象内部的[[Prototypete]]被赋值为构造函数的prototype属性
  3. 构造函数内部this被赋值为这个空对象
  4. 执行构造函数内部代码，为空对象添加属性