[toc] ### 1. ES5中的面向对象(构造函数) 构造对象与构造类不分开，写法一致 ``` function User(name, pass){ this.name = name; this.pass = pass; } //在原型上添加方法 User.prototype.showName = function(){ alert(this.name); } User.prototype.showPass = function(){ alert(this.pass); } var ul = new User('blue', '123456'); ul.showName(); ul.showPass(); ``` ### 2. ES6中的面向对象(构造函数) 1. class关键字、构造器和类分开了 2. class里面直接加方法，也可以直接在原型上`.prototype.`加 3. 创建类要在声明class之后 ``` class User{ //原型 constructor(name, pass){ //构造器 this.name = name; this.pass = pass; } showName(){ //原型上的方法 alert(this.name); } showPass(){ alert(this.pass); } } var ul = new User('blue', '123456'); ul.showName(); ul.showPass(); ``` ### 3. 原型 声明一个变量，它会具有一个`__proto__`属性，指向它的原型，如`Number.prototype`，在原型上也有一个`__proto__`属性，指向`Object` ``` var a = 10; // console.log(a); console.log(a.__proto__); ``` 在构造函数中的原型 ``` /* 整个类可视为一个原型 */ class Person{ constructor(name, age){ this.name = name; this.age = age; } sayName(){ console.log(this.name); } } var xu = new Person("xu", 21); console.log(xu); console.log(xu.__proto__); ``` ### 4. 继承 1. js中每一个对象都有`__proto__`属性，指向它的原型对象 2. javascript的继承是基于原型的继承 3. 继承是继承原型上的方法 4. `hasOwnProperty()` 可以检查对象拥有的独特属性 ``` var a = [1, 2, 3]; Array.prototype.say = function(){ console.log("say"); } a.say(); //say ``` 4. Object.getPrototypeOf(obj) --> 获取对象的原型 ``` console.log(Object.getPrototypeOf(a)); ``` #### 1. ES5中的继承 ``` function VipUser(name, pass, level){ User.call(this, name, pass); this.level = level; } VipUser.prototype = new User(); VipUser.prototype.constructor = VipUser; VipUser.prototype.showLevel = function(){ alert(this.level); }; var v1 = new VipUser('blue', '12345', '3'); v1.showLevel(); ``` #### 2. ES6中的继承 ``` class VipUser extends User{ constructor(name, pass, level){ super(name, pass); this.level = level; } showLevel(){ alert(this.level); } } var v1 = new VipUser('blue', '1234', 3); v1.showLevel(); ``` ### 5. __proto__和prototype `__proto__` 是实例具有的属性，指向原型 `prototype` 是构造函数具有的属性，可以直接通过`构造函数.prototype.函数名 = function(){}` 在原型上添加方法