es5 类与继承

2020-11-03  本文已影响0人  Astep

ES5定义一个类

function Person(name, sex) { // 构造函数
    this.name = name;
    this.sex = sex; // 实例属性,必须要new person 的时候才能被调用
    this.run = function () { // 实例方法,必须要new person 的时候才能被调用
        console.log(this.name + "在运动!");
    };
};

创建一个静态方法

Person.getUserInfo = function () { // 静态方法
    console.log("我是一个静态方法");
};
Person.getUserInfo(); // 调用静态方法

实例化Person类

let ps = new Person("qiyingcong", "男"); // 实例化Person类
ps.run(); // 调用Person类的run方法
console.log(ps.sex); // 访问Person类的属性

/**
 * 通过原型链来给Person类扩展方法和属性
 * 原型链上的属性和方法会被多个实例共享  构造函数不会
 */
Person.prototype.age = "22";
Person.prototype.work = function () {
    console.log("上班是写代码的IT程序员@");
};

es5上的继承分为两种:(原型链)、(对象冒充)

function Web(name, sex) { // Web类继承Person类   是通过对象冒充实现继承
    Person.call(this);  // 对象冒充继承只继承构造函数方法和属性,没法继承(原型链)函数方法和属性
};
Web.prototype = new Person(); // 原型链继承 (又可以继承构造函数的属性方法也可以继承原型链的属性方法)   缺点:实例化子类没法给父类传参
let w = new Web("qiyingcong", "男");

// 原型链加对象冒充组合
function Nax(name, sex) {
    Person.call(this, name, sex);
};
Nax.prototype = Person.prototype; // 另一个方法 new Person();
let n = new Nax("qiyingcong", 22); // (实例化子类给父类传参)

如果对您有帮忙,麻烦点个赞,感谢!

上一篇 下一篇

猜你喜欢

热点阅读