面向对象编程
JavaScript的所有数据都可以看成对象,那是不是我们已经在使用面向对象编程了呢?
当然不是。如果我们只使用Number
、Array
、string
以及基本的{...}
定义的对象,还无法发挥出面向对象编程的威力。
JavaScript的面向对象编程和大多数其他语言如Java、C#的面向对象编程都不太一样。如果你熟悉Java或C#,很好,你一定明白面向对象的两个基本概念:
-
类:类是对象的类型模板,例如,定义
Student
类来表示学生,类本身是一种类型,Student
表示学生类型,但不表示任何具体的某个学生; -
实例:实例是根据类创建的对象,例如,根据
Student
类可以创建出xiaoming
、xiaohong
、xiaojun
等多个实例,每个实例表示一个具体的学生,他们全都属于Student
类型。
所以,类和实例是大多数面向对象编程语言的基本概念。
不过,在JavaScript中,这个概念需要改一改。JavaScript不区分类和实例的概念,而是通过原型(prototype)来实现面向对象编程。
原型是指当我们想要创建xiaoming
这个具体的学生时,我们并没有一个Student
类型可用。那怎么办?恰好有这么一个现成的对象:
var robot = {
name: 'Robot',
height: 1.6,
run: function () {
console.log(this.name + ' is running...');
}
};
我们看这个robot
对象有名字,有身高,还会跑,有点像小明,干脆就根据它来“创建”小明得了!
于是我们把它改名为Student
,然后创建出xiaoming
:
var Student = {
name: 'Robot',
height: 1.2,
run: function () {
console.log(this.name + ' is running...');
}
};
var xiaoming = {
name: '小明'
};
xiaoming.__proto__ = Student;
注意最后一行代码把xiaoming
的原型指向了对象Student
,看上去xiaoming
仿佛是从Student
继承下来的:
xiaoming.name; // '小明'
xiaoming.run(); // 小明 is running...
xiaoming
有自己的name
属性,但并没有定义run()
方法。不过,由于小明是从Student
继承而来,只要Student
有run()
方法,xiaoming
也可以调用:
JavaScript的原型链和Java的Class区别就在,它没有“Class”的概念,所有对象都是实例,所谓继承关系不过是把一个对象的原型指向另一个对象而已。
如果你把xiaoming
的原型指向其他对象:
var Bird = {
fly: function () {
console.log(this.name + ' is flying...');
}
};
xiaoming.__proto__ = Bird;
现在xiaoming
已经无法run()
了,他已经变成了一只鸟:
xiaoming.fly(); // 小明 is flying...
在JavaScrip代码运行时期,你可以把xiaoming
从Student
变成Bird
,或者变成任何对象。
请注意,上述代码仅用于演示目的。在编写JavaScript代码时,不要直接用obj.__proto__
去改变一个对象的原型,并且,低版本的IE也无法使用__proto__
。Object.create()
方法可以传入一个原型对象,并创建一个基于该原型的新对象,但是新对象什么属性都没有,因此,我们可以编写一个函数来创建xiaoming
:
// 原型对象:
var Student = {
name: 'Robot',
height: 1.2,
run: function () {
console.log(this.name + ' is running...');
}
};
function createStudent(name) {
// 基于Student原型创建一个新对象:
var s = Object.create(Student);
// 初始化新对象:
s.name = name;
return s;
}
var xiaoming = createStudent('小明');
xiaoming.run(); // 小明 is running...
xiaoming.__proto__ === Student; // true
这是创建原型继承的一种方法,JavaScript还有其他方法来创建对象,我们在后面会一一讲到。
相关文章
- 【404】你访问的页面需要关灯后查看!
- 摸鱼搞了个掘金数据监控桌面应用,还不快用起来!
- 这个实现不对,要的是excel里面的高亮重复项效果
- 精选Github计算机开源视觉项目
- 腾讯云大数据流计算 Oceanus 在 MySQL CDC Connector 的核心优化
- 网宿科技携手亚马逊云科技,助力云计算成为真正的生产力
- 【FAQ】分析服务导出的事件数据和概览页面展示的数据不一致该如何解决?
- 金融App面临安全风险?解锁HMS Core安全检测服务解决方案
- CodeArts TestPlan:一站式测试管理平台
- cookie、session,、token,还在傻傻分不清?
- 一文了解华为FusionInsight MRS HBase的集群隔离方案RSGroup
- 高并发环境下构建缓存服务,你需要注意这6点
- 一文详解RocketMQ的存储模型
- Serverless时代的微服务开发指南:华为云提出七大实践新标准
- 用100W+行代码贡献经验,带你了解如何参与OpenHarmony开源
- CSV:简单格式下隐藏的那些坑
- 能将三次握手讲到这个程度,不给你offer给谁!
- 细数华为云云原生产品及五大开源实践
- 解密秒杀系统架构:不是所有的秒杀都是秒杀
- 《迷你世界》亿级玩家都在用的游戏场景推荐系统长啥样?