JavaScript必知的特性（继承）

多数人在学习JavaScript的时候。都是作Web的时候。需要表单验证。或者是一些简单的DOM操做，如同我上篇所讲。处在一个“辅助”的地位。

处在“辅助”地位的JavaScript，咱们老是抱着解决这个问题便可的态度，天然不会关注其过多的特性。那么。今天咱们就来聊聊在开发中有哪些特性是咱们必须要了解的。

JavaScript的结构

JavaScript分为三个部分

• ECMAScript  JavaScript自己的语法

• DOM  全称Document Object Model 。针对HTML Document操做的API，好比document.getElementByID

• BOM  全称Browser Object Model，针对浏览器Window操做的API,好比window.location

在通常的项目中。多数人会关注DOM操做，因此忽略了JavaScript语法自己的精髓。咱们今天重点关注的就是：JavaScript自己语法。

请注意：咱们在前端使用JavaScript时，多数是以操做DOM为目的，学习JavaScript语言的精髓，自己就是为了让咱们更优雅的“操做DOM”！

由于JS的每一个特性都包括太多内容，因此咱们仅仅能分多篇来说。今日咱们先讲继承！

我对于继承的解说方法会和百度的帖子迥异，但更通俗一些。但愿你们看过以后可以秒懂“继承”。

面向对象的三大原则：封装，继承，多态。咱们不能脱离其它法则单讲继承，封装是继承的先决条件。多态是继承要达到的目的，三者是纠合在一块儿的！

---

1. 封装  

封装是对象的表现形式。

比方Java中，封装的表现形式是JavaBean，在JavaScript就是Object，通俗点就是{}

咱们来看JavaScript的一个简单对象

对象的两个要点：属性和行为， name做为属性，work做为行为，已经知足封装的基本要素，因此咱们认定student是一个对象。它的对象就是如此简单。

咱们这里多插一个知识点：对象和咱们平时讲的JSON，有什么不一样呢？

JSON是JavaScript对象标记语言。JSON的做用是传输数据。“数据”具备不可变性。因此JSON仅仅能包括属性。不能有行为。

即：JSON中没有不论什么JavaScript方法！它们的差异就在于有没有包括方法。

要记住JSON和对象的差异，仅仅要咱们记住一句绕口令就能够：JSON必定是JavaScript对象。JavaScript对象不必定是JSON！

---

2. 继承

所有的JavaScript的对象，在其生成的时候，编译器都会附加给对象一个特殊的属性：prototype，即你们常说的原型。理解原型是理解JavaScript继承的重点。

原型有一个最最最重要的特色： 强单例 。同一类型的对象拥有的原型是一个，比方Array。所有的Array实例的原型仅仅有一个。

如下的代码中。arr1和arr2的prototype指向的是同一个，假设设置arr1的为null，arr2的也就为null了。

咱们在看JavaScript的API时，经常看到Array的方法有：push shift slice splice等等，这些方法都是存在Array的prototype中。

咱们再来看看，当咱们调用一个JavaScript对象方法的时候。它的解析器是怎样工做的？

好比调用arr1.push 方法，

1. 解析器会首先遍历“对象自己”的方法。假设找到。则直接调用，不然，继续第二步骤

2. 解析器会查看对象的Prototype对象中是否存在该方法，存在则调用。不存在就抛出Exception

说到这里。你们应该秒懂“Prototype”是个什么东西了吧。 事实上就是给对象附加一个内部对象而已，这个内部对象又是一个单例的。做为单例，相对于对象自己确定高效率的！ 但是也是危急的！。

比方刚才我贱贱的设置arr1的prototype为null，那完蛋了！

。整个页面的Array都要出错。假设我这样改动。预计有些不明因此的程序猿都要哭了，尼玛浏览器会骂人！

看过以上，请你们记住：每个JavaScript对象都分为两个部分：“自己”和prototype。那么对象的继承也是针对这两个部分展开的。继承的目的是为了扩展。说更通俗点就是，为了给某个对象附加不少其它的方法。

这时候问题就回归为,怎样给JavaScrit对象附加方法？

针对自己附加

上面的student，这时候又来了小明同窗，但是小明同窗比Aric多了一项技能，会撸呀撸！ 要怎样实现呢？

jquery的extend的原理就是把一个对象的所有属性和方法附加到另一个上面。

针对prototype附加

假设上面代码改动为：小明.prototype.lol = func...这样也实现了相同的功能。但是这时候Aric也有了LOL这个功能。

百度上多数讲继承的帖子。都会有例如如下这种伪代码。 咱们看过以上文章。是否是就明确了为何！ 我之前看过无数的继承的帖子，一直也不懂prototype是个什么玩意！

！

关于继承的使用，这里基本落幕，你们心中都应该有一个初步的印象了。

当你懂的事物的原理后。再学习起来应该就更加驾轻就熟了。

---

3. 多态

面向对象的三大原则之中的一个：多态。多态分为对象多态和方法多态！

这是两个不一样的概念。

对象多态

就是咱们时常看到的猫狗都属于动物。猫叫是喵喵。狗倒是汪汪，这是多态的最直接体现。至于不少其它实现细节，请你们自行百度。

方法多态

方法多态，就是方法名字一样，但是传入的參数列表不一样。这个在Java或者C#中都被咱们玩烂了！ 在JavaScript中由于没有參数列表，通常都用方法的内部函数Arguments来表述！Arguments是伪Array。里面放的就是当前方法的參数列表！

详细使用过程当中，就能够经过Arguments中元素的个数来实现方法多态。

---

很是多人都说JavaScript不是面向对象的编程语言。事实上是对JavaScript的误解。面向对象的三大原则，JavaScript都能实现！仅仅是实现的方式有些不一样，却有殊途同归之妙。

说在最后的话：

JavaScript的继承不像Java那样有明白的语法规则。它是灵活多变的。因此写惯Java这样的类型的人员。很讨厌其语法。我在刚入门时，也是如此。但是在当你掌握了它，它的灵活多变会变成编程中的利器。剑之所指，所向披靡！

---

但愿每一位有心学习JavaScript的程序猿，都能理解其继承原理！

接下来，咱们会继续解说JavaScript的其它特性！在解说这些特性的同一时候。我会结合其一些知名类库，比方jQuery，解说这些特性在当中的应用。