class语法

面向对象

面向过程

var name = "Tom";
var age = 13;
var gender = "male";

var name = "Jerry";
var age = 15;
var gender = "female";

面向对象

1. 代码复用，面向对象中类这种技术可以极大的体现代码复用
2. 同一类的对象应当由同一种类来生成
3. 面向对象实际上就是对问题域进行封装

 var o = {
     name: "Tom",
     age: 13,
     gender: "male"
 }

 var o = {
     name: "Jerry",
     age: 15,
     gender: "female"
 }

function Animal(_name, _age, _gender) {
    this.name = _name;
    this.age = _age;
    this._gender = gender;
}

var o1 = new Animal("Tom", 13, "male");
var o2 = new Animal("Jerry", 15, "famale");

class语法

calss为构造函数的语法糖

//class没有形参列表
class Person {
    //只有所有实例化对象都有该属性，并且没有差异采用这种方式添加属性
    //因为不能传参
    abc = "hello";                   
//constructor为构造函数名，省略function关键字
//如果不手动添加，会自动添加
//该构造函数名必须为constructor

constructor (name, age, gender) {
    this.name = name;
    this.age = age;
    this.gender = gender;
    //该方法直接被添加都实例化对象作为静态方法
    // this.say = function () {
    //     console.log(`我叫${this.name}，今年${this.age}岁`);
    // }
}

//所有的属性都会被添加到原型中（constructor中），原有的属性都会被添加都对象身上
say() {
    console.log(`我叫${this.name}，今年${this.age}岁`);
}

}

var o = new Person("Tom", 18, "male");
console.log(o);

//相当于具名函数声明表达式
var c = class Person{
	constructor () {
	
	}
}
var o = new c("tom", 18, "male")
console.log(o)

calss底层实现

 function Person (name, age, like) {
     this.abc = "aaaaaaaabbbbbbbbbbbbbccccc";
     this.name = name;
     this.age = age;
     this.like = like;
     this.say = function () {
         console.log("我叫" + this.name + "，我今年" + this.age + "，就爱" + this.like + "。");
     }
 }

Person.prototype.say = function () {
    console.log("我叫" + this.name + "，我今年" + this.age + "，就爱" + this.like + "。");
}