JavaScript 中的面向对象编程

引见

JavaScript 是一个弱小的面向对象编程言语,但是,并不像传统的编程言语,它采用一个以原型爲根底的OOP模型,致使它的语法让大少数开发人员看不懂。另外,JavaScript 也把函数作爲首要的对象,这能够会给不够熟习这门言语的开发人员形成更大的困惑。那就是我们决议放在后面作爲一个冗长前言停止引见的缘由,并且在 JavaScript 里也可以用作面向对象编程的一个参考。

这个文档没有提供一个面向对象编程的规则预览,但有它们的接口概述。

命名空间

随着越来越多的第三方库,框架和web依赖的呈现,JavaScript开展中的命名空间是势在必行的,我们得尽量防止在全局命名空间的对象和变量的抵触。

不幸的是,JavaScript没有提供支持命名空间的编译,但是我们可以运用对象来失掉异样后果。在JavaScript中我们有许多种形式来完成命名空直接口,但是我们掩盖嵌套的命名空间,它在该范畴是最常用的形式。

嵌套命名空间

嵌套的命名空间形式运用对象字面量来捆绑一个特定使用的特定名字的功用。

我们最后创立一个全局对象,并且赋值给一个称爲MyApp的变量。

上述的语法会反省MyApp能否曾经被定义过。假设它曾经被定义过,我们复杂地把它赋值给本人,但是,我们创立一个空的容器来装载我们的函数和变量。

我们也可以运用相反技术来创立子命名空间。例如:

我们一旦启动我们的容器,我们可以在(容器)外部定义我们的函数和变量,并且在全局命名空间调用它们,不需求冒着与现有定义抵触的风险。

在JavaScript命名形式的一个外部概述是由Goggle的Addy Osmani在Essential JavaScript Namespacing Patterns的文章中引见的。假设你想探究不同的形式,这里将是一个美妙的终点。

对象

假如你写过 JavaScript 代码,那你曾经运用过对象了。JavaScript 有三品种型的对象:

原生对象

原生对象是言语标准的一局部,不论在什麼样的运转环境下运转,原生对象都可用。原生对象包括:Array、Date、Math 和 parseInt 等。想理解一切原生对象,请参阅 JavaScript 内建对象参考

宿主对象

与原生对象不同,宿主对象是由 JavaScript 代码运转的环境创立。不同的环境环境创立有不同的宿主对象。这些宿主对象在少数状况下都允许我们与之交互。假如我们写的是在阅读器(这是其中一种运转环境)上运转的代码,会有 window、document、location 和 history 等宿主对象。

用户对象

用户对象(或植入对象)是在我们的代码中定义的对象,在运转的进程中创立。JavaScript 中有两种方式创立本人的对象,上面详述。

对象字面量

在后面演示创立命名空间的时分,我们曾经接触到了对象字面量。如今来搞清楚对象字面量的定义:对象字面量是置于一对花括号中的,由逗号分隔的名-值对列表。对象字面量可拥有变量(属性)和函数(办法)。像 JavaScript 中的其它对象一样,它也可以作爲函数的参数,或许前往值。

如今定义一个对象字面量并赋予一个变量:

向这个对象字面量添加属性和办法,然后在全局作用域拜访:

这看起来和后面的命名空间很像,但这并不是巧合。字面量对象最典型的用法就是把代码封装起来,使之在一个封装的包中,以防止与全局作用域中的变量或对象发作抵触。由于相似的缘由,它也经常用于向插件或对象传递配置参数。

假如你熟习设计形式的话,对象字面量在某种水平下去说就是单例,就是那种只要一个实例的形式。对象字面量后天不具有实例化和承继的才能,我们接上去还得理解 JavaScript 中另一种创立自定义对象的办法。

结构函数

定义结构函数

函数是 JavaScript 一等公民,就是说其它实体支持的操作函数都支持。在 JavaScript 的世界,函数可以在运转时停止静态结构,可以作爲参数,也可以作爲其它函数的前往值,也可被赋予变量。而且,函数也可以拥有本人的属性和办法。JavaScript 中函数的特性使之成爲可以实体化和承继的东西。

来看看怎样用结构函数创立一个自定义的对象:

创立结构函数相似于创立普通函数,只要一点例外:用 this 关键字定义自发性和办法。一旦函数被创立,就可以用 new 关键字来生成实例并赋予变量。每次运用 new 关键字,this 都指向一个新的实例。

构建函数实例化和传统面向对象编程言语中的经过类实例化并非完全不同,但是,这里存在一个能够不易被发觉的成绩。

当运用 new 关键字创立新对象的时分,函数块会被重复执行,这使得每次运转都会发生新的匿名函数来定义办法。这就像创立新的对象一样,会招致顺序耗费更多内存。这个成绩在古代阅读器上运转的顺序中并不显眼。但随着使用规则地扩展,在旧一点的阅读器、计算机或许低电耗设备中就会呈现功能成绩。不过不必担忧,有更好的方法将办法附加给结构函数(是不会净化全局环境的哦)。

办法和原型

后面引见中提到 JavaScript 是一种基于原型的编程言语。在 JavaScript 中,可以把原型当作对象模板一样来运用。原型能防止在实例化对象时创立多余的匿名函数和变量。

在 JavaScript 中,prototype 是一个十分特别的属性,可以让我们爲对象添加新的属性和办法。如今用原型重写下面的示例看看:

这个示例中,不再爲每个 Person 实例定义 sayHey 办法,而是经过原型模板在各实例中共享这个办法。

承继性

经过原型链,原型可以用来实例承继。JavaScript 的每一个对象都有原型,而原型是另外一个对象,也有它本人的原型,循环往复…直到某个原型对象的原型是 null——原型链到此爲止。

在拜访一个办法或属性的时分,JavaScript 首先反省它们能否在对象中定义,假如不,则反省能否定义在原型中。假如在原型中也没找到,则会延着原型链不断找下去,直到找到,或许抵达原型链的终端。

如今来看看代码是怎样完成的。可以从上一个示例中的 Person 对象开端,另外再创立一个叫 Employee 的对象。

如今 Employee 只要一个属性。不过既然员工也属于人,我们希望它能从 Person 承继其它属性。要到达这个目的,我们可以在 Employee 对象中调用 Person 的结构函数,并配置原型链。

要顺应原型承继还需求一些工夫,但是这一个必需熟习的重要概念。虽然原型承继模型经常被以为是 JavaScript 的弱点,但实践上它比传统模型更弱小。比方说,在掌握了原型模型之后创立传统模型几乎就太容易了。

ECMAScript 6 引入了一组新的关键字用于完成 类。虽然新的设计看起来与传统基于类的开发言语十分接近,但它们并不相反。JavaScript 依然基于原型。

结论

JavaScript曾经经过了长工夫的开展,在此时期,按明天的规范来看,一些本不应该运用的办法,却被少量开发者运用着。依据 ES2015 的引见,这种情况正开端渐渐改动,但是,许多开发人员依然坚持运用一些旧的编程方式,这损害了他们的代码的关联性。了解面向对象编程办法,并将它使用在你的JavaScript项目中,关于编写可继续的代码十分有意义。

我希望这个冗长的引见将有助于你到达这个目的。

via:http://www.oschina.net/translate/object-oriented-programming-javascript

未经允许不得转载:绿岛小站 » JavaScript 中的面向对象编程

赞 (3)

评论 0

评论前必须登录!

登陆 注册