ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript之继承

2020-02-29 16:04:27  阅读:264  来源: 互联网

标签:console log 继承 javascript kitty cat color type


ES6语法实现

class Animal {
    constructor(type, color) {
        this.type = type
        this.color = color
    }
    speak(word) {
        console.log(this.type + " says " + word)
    }
    colorIs() {
        console.log(`${this.type} is ${this.color}`)//ES6新的字符串拼接方式
    }
}
class Cat extends Animal {
    constructor(color) {
        super()
        this.type = "cat"
        this.color = color
    }
    speak() {
        console.log("cat says miao")
    }
    eat() {
        console.log("eat rats")
    }
}
let kitty = new Cat("yellow")
kitty.speak()
kitty.speak("mew")//js没有函数重载,子类的speak()会将父类的speak(word)覆盖
kitty.eat()
kitty.colorIs()

输出:

cat says miao
cat says miao
eat rats
cat is yellow

ES5原型链继承与构造器继承

var Animal = function (type, color) {
    this.color = color;
    this.type = type;
    this.say = function () {
        console.log(`I am a ${this.color} ${this.type}`);
    }
}
var dog = new Animal("dog", "yellow");
dog.say();

var Cat = function (color) {
    this.color = color;
    this.type = 'cat';
    this.eat = function () {
        console.log(`${this.color} ${this.type} eats rat`);
    }
}
Cat.prototype = new Animal();
var kitty = new Cat('pink');
kitty.say();
kitty.eat();

var Human = function (type) {
    Animal.call(this, type, 'smart');
    this.make = () => {
        console.log(`${this.type} makes tools`);
    }
}
var liMing = new Human('Chinese');
liMing.say();
liMing.make();

输出:

I am a yellow dog
I am a pink cat
pink cat eats rat
I am a smart Chinese
Chinese makes tools

标签:console,log,继承,javascript,kitty,cat,color,type
来源: https://www.cnblogs.com/Minstrel223/p/12383377.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有