class 浅析

2022-01-21 16:00:45 阅读：193 来源： 互联网

标签：console log class Cat Say prototype 浅析

ES6 规范中，引入了 class 的概念。
但是 JS 中并没有一个真正的 class 原始类型， class 仅仅只是对原型对象运用语法糖。

class Cat{
    constructor(name,age){
        this.name = name;
        this.age = age;
    }
	
    Say(){
        return '我的名字是' + this.name;
    }
}
var cat1 = new Cat('有鱼',2);
console.log(cat1.Say()); //我的名字是有鱼

cat1.constructor === Cat //true
cat1.__proto__ === Cat.prototype //true

class与原型的关系

class本质上就是一个函数，自身指向的就是构造函数

console.log(typeof Cat);// function
console.log(Cat.prototype.constructor === Cat);//true

class是构造函数的另一种写法，仍然存在prototype方法

console.log(Cat.prototype);//object

可以通过原型prototype修改类方法和新增方法

Cat.prototype.Say = function(){
    return '我的名字是' + this.name+',我是原型prototype声明同样的Say方法，把原有Say方法覆盖了';
}
cat2 = new Cat('年年',5);
console.log(cat2.Say());//我的名字是年年，我是原型prototype声明同样的Say方法，把原有Say方法覆盖了
Cat.prototype.Go = function(){
    return '我的年龄是' + this.age;
}
console.log(cat2.Go());//我的年龄是5

还可以通过Object.assign方法来为对象动态增加方法

Object.assign(Cat.prototype,{
    Eat:function(){
        return this.name;
    },
    Run:function(){
        return this.age;
    }
})
cat3 = new Cat('卡卡',4);
console.log(cat3.Eat());//卡卡
console.log(cat3.Run());//4

也可以使用实例对象的__proto__属性新增类的方法

cat3 = new Cat('卡卡',4);
cat4 = new Cat('楼楼',10);
cat3.__proto__.Play = function(){
    return this.name;
}
console.log(cat3.Play());// 卡卡
console.log(cat4.Play());// 楼楼

标签：console,log,class,Cat,Say,prototype,浅析
来源： https://www.cnblogs.com/yujiaming890321/p/15830566.html

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

ICode9

class 浅析

class与原型的关系