标签:使用 code his turn 特性 cal 重写 父类 gen
在本篇文章我将会把我对JavaScript es6新特性class类的理解。本着互联网的分享精神,我就将我自己的理解分享给大家。
在es5中大家一般都这么写一个类(构造函数)
另外需要注意,class类不会被提升。
// 创建一个User构造函数 function User(name, age) { this.name = name; this.age = age; } // User构造函数的静态方法。 User.getClassName = function () { return ‘User‘; }; // User构造函数的动态方法 User.prototype.changeName = function (age) { this.age = age }; Object.defineProperty(User.prototype, ‘info‘, { get (){ return ‘name: ‘ + this.name + ‘|‘ + ‘age: ‘ + this.age } }); // 创建一个Manager 构造函数 function Manager(name, age, password) { User.call(this, name, age); //将User函数call到Manager函数内 this.password = password } // 继承User的静态方法 Manager.__proto__ = User; // 调用继承User的getClassName 方法。 console.log(Manager.getClassName()); // 继承User动态方法 Manager.prototype = User.prototype; // 创建一个新的动态方法 changePassword Manager.prototype.changePassword = function (pwd) { this.password = pwd }; //实例化Manager 构造函数。 var manager = new Manager(‘zhang‘, 22, ‘123‘); manager.changeName(‘23‘); console.log(manager.info);
以上方法确实没有什么问题,但是相对于es6的class来讲没有那么优雅,下面我就用es6的语法让代码优雅一点。
其实本质上都是一样的,只不过是一个语法糖。
/** * Created by 张佳伟 on 2017/5/2. */ ‘use strict‘; // function User(name, age) { // this.name = name; // this.age = age; // } class User { // 构造函数 现在叫类 本质是一样的,其实就是一个语法糖。 constructor(name, age) { this.name = name; this.age = age; } // User.getClassName = function () { // return ‘User‘; // }; // 静态方法 static getClassName() { return ‘User‘; } // User.prototype.changeName = function (name) { // this.name = name; // }; // 动态方法,相当于es中的prototype changeName(name) { this.name = name; } // User.prototype.changeAge = function (age) { // this.age = age; // }; changeAge(age) { this.age = age; } // Object.defineProperty(User.prototype, ‘info‘, { // get (){ // return ‘name: ‘ + this.name + ‘|‘ + ‘age: ‘ + this.age // } // }); get info() { return ‘name:‘ + this.name + ‘|age:‘ + this.age; } } ; // function Manager(name, age, password) { // User.call(this, name, age); // this.password = password; // } //继承静态方法 // Manager.__proto__ = User; // //继承prototype原型方法 // Manager.prototype = User.prototype; // 继承这里省事吧,一步就到位了 class Manager extends User { constructor(name, age, password) { super(name, age); //这个我下面会将,这里先暂时理解为call,但是注意他和call可不一样。 this.password = password; } changePassword(password) { return this.password = password; } get info() { var info = super.info; //这个是父类的info,当然你也可以重写info这个方法。那就是删掉这句代码,在写上新的就行拉~ return info } } // console.log(typeof User, typeof Manager); var manager = new Manager(‘leo‘, 22, ‘123‘); // manager.changeName(‘zeng liang‘); console.log(manager.info); console.log(manager.changePassword(456))
立即执行类的写法
‘use strict‘; // 立即执行的类 let User = new class User { constructor(name){ this.name = name; } }(‘铅笔‘) console.log(User)
标签:使用 code his turn 特性 cal 重写 父类 gen
原文地址:http://www.cnblogs.com/waitforyou/p/6918871.html