js类和构造函数的4点差异

一,变量提升问题

  console.log(Man);
    function Man(name, age) {
      this.name = name
      this.age = age
    }

是可以打印的

但是用类的方法,就有暂时性死区了

console.log(Man);
    class Man {
      constructor(name, age) {
        this.name = name
        this.age = age
      }
    }

二,new的问题

如果是类的方法,那只能用new,没有new的话报错

console.log(Man());

 

 而构造函数可以,因为它本来就是一个函数,返回值为undefined,想要返回值,就得手动加上

 

 function Man(name, age) {
      this.name = name
      this.age = age
      return '我是没有new也行的返回值'
    }

 

 console.log(Man('小白', 19));

三, class采用的是严格模式

arguments.callee指向当前arguments指向的函数

function Man(name, age) {
      this.name = name
      this.age = age
      console.log(arguments.callee);
      return '我是没有new也行的返回值'
    }

打印出

ƒ Man(name, age) {
      this.name = name
      this.age = age
      console.log(arguments.callee);
      return '我是没有new也行的返回值'
    }

但是在class中

 class Man {
      constructor(name, age) {
        this.name = name
        this.age = age
        console.log(arguments.callee);
      }
    }

就会报错

 

---

---

四,class原型上的对象不能遍历

先看一下构造函数方式

function Man(name, age) {
      this.name = name
      this.age = age
      console.log(arguments.callee);
      return '我是没有new也行的返回值'
    }
    // Man.prototype.say = function () {
    //   console.log(`你好${this.name}`);
    // }
    Man.prototype = {
      hit() {
        console.log('打你一下哦');
      }
    }

然后遍历的时候

let p1 = new Man('小白', 18)
    for (let key in p1) {
      console.log(key);
    }

 可以把原型上的hit打印出来

但是用class的方式

class Man {
      constructor(name, age) {
        this.name = name
        this.age = age
      }
      play() {//这是原型上的方法
        console.log('我爱运动');
      }
    }

只能打印name和age,不能打印出play