学JS的心路历程-JS支持面向对象?(一)

昨天在看Prototype看到JS支持面向对象,被前辈问到说那什么是面向对象?JS是面向对象语言吗?

便开始了一连串艰辛爬文过程,今天就来看一下两者有什么差异吧(rgwyjc)!

首先面向对象有三大特色,封装、继承及多态,这三个都是抽象的概念。

其中继承这个抽象的概念,是为了避免多个类别间重复定义了相同行为与实作。基本上有两种实作的方式可以实现,「原型继承」与「类别继承」。

这两者分别的特色如下。

类别继承classical inheritance:

可以从同一个类别(class)中实例多个物件。

可以将类别组织成层次结构,进而重覆使用代码。

常用的代码(More general code)将会储存在高阶的类别,由低阶的类别继承。

什么是常用的代码?举例来说,如果今天有两只不同品种的狗,但是叫声都是一样的,那我们便会把叫声储存在高阶的类别:

public class dog {

public String voice =“wong!”;

}

public class GoldenRetriever extends dog {

public String color =“gold”;

}

意味者物件与其它物件共享相同类别及父类别。

建立物件的时候,会需要先写出一个物件的类别(Class),然后,才利用这个类别来建立包含数据的物件,物件受限于类别而无法即时新增属性和方法。

Java或C++的继承是在定义类别时指定要继承的类别来当作父类别(SuperClass)

原型继承prototypal inheritance

物件直接继承其他物件,没有所谓的类别,需要物件就直接写一个(rgyqjy)。

物件利用层级结构连接在一起,所以仍然可以重复使用。

每个物件都跟创建它的物件有秘密连接,这形成一个链。

物件被呼叫自己没有的属性时,它的父层将被呼叫,不断往上找直到找到或到达根物件为止。

继承是经由指定物件的Prototype物件来达成的。

可以在建立后的任何时间,透过Prototype属性来指定要继承的物件

只要被继承的物件新增属性或方法,继承的物件也可以马上使用这些新增的属性和方法

方法和属性可以动态新增,因此,弹性会比需要定义类别式的语言来得大,但是,相对的,程序结构就比较不严谨,也比较容易发生执行时期的错误!

所以在JS中的每个函式(他们都是物件),实际上都有一个prototype的成员,负责在被呼叫物件时提供。

拥有这个成员允许了建构式的运作。

将属性新增至函式物件的prototype可使它被使用于建构式的物件,以及从这建构式继承的物件。

JS的原型继承是继承这个抽象概念的实现方式的一种。

以上就是关于两种继承的比较,如果有错误及来源为附上欢迎留言指正,那么我们明天见(rgswgy)!

原文地址:https://www.cnblogs.com/lannyQ-Q/p/10011406.html

时间: 2024-10-29 03:05:25

学JS的心路历程-JS支持面向对象?(一)的相关文章

学JS的心路历程 - JS的Class

没错,你没有看错,虽然前面说JS是原型继承,但在ES6以后新增了class关键字!!! 不过底层实作仍然是以原型继承方式进行,所以基本上算是一个语法糖. 今天我们就来看一下如何使用吧! class 首先先来看一个最简单的class例子. class Person{ constructor(val){ this.age = val: } say(){ return"Hi!": } } var Jason = new Person(29): Jason instanceof Person:

学JS的心路历程 -非同步执行

JS是单线程的语言,也就是说同一时间只会执行一行程序,所以如果一段程序执行过久就会造成阻塞(blocking)的现象,必须等到它结束后才能执行下一段程序. 举个例子来说,如果我们今天要买便当,但是老板说要十分钟才会好,那难道我们这十分钟内都不能做任何事情吗? 当然不是,JS本身有非同步执行的功能,也是就说我们会先跟这个函式说,你先到旁边继续跑,好了在「回来呼叫」我,我先继续跑其他程序. 有没有看到熟悉的关键字「回来呼叫」,没错非同步执行基本上都是利用callback达成. 举个例子来说,我们今天

学JS的心路历程-函式(五)箭头函式

箭头函式arrow function 为了能够以更简短的方式建立函式,ES6变推出了箭头函式. 用说明的可能会不太懂,我们先拿之前的数组排序例子来看: var arr = [2,1,6,12,3,77,100,4]: arr.sort(function(a,b){ return a - b: }): arr.sort()经过箭头函式的修改后: var arr = [2,1,6,12,3,77,100,4]: arr.sort((a,b)=> a-b): 是不是简洁许多了! 现在让我们一步一步来看

React+Immutable.js的心路历程

这段时间做的项目开发中用的是React+Redux+ImmutableJs+Es6开发,总结了immutable.js的相关使用姿势: Immutable Data 顾名思义是指一旦被创造后,就不可以被改变的数据.可以通过使用Immutable Data,可以让我们更容易的去处理缓存.回退.数据变化检测等问题,简化我们的开发. 我们知道 react.js很著名的就是它处理dom的做法,它是通过Virtual Dom来查看diff,然后再改动需要改动的Dom.但是有个问题当state更新时,如果数

学习JS的心路历程-声明

变量 在程序中将一个值指定(assign)给一个符号式的容器(symbolic container),叫做一个变量(variable). 声明在JS中目前提供了三种声明方式: var 声明一个变量,可选择是否给予一个初始值. 作用范围(scope)于该函式之内:但是如果在函式外声明,其作用范围则为全局性(global). var price = 10: price = price * 2: console.log(price): let(ES6新增) 声明一个内存块范围(scope)内的本地变量

学习JS的心路历程-范围Scope和提升(Hoisting)

在上一篇提到了JS有三种声明变量的方式,分别是var.const及let,var和const let最大区别就是范围(scope)的限制.所以在这一篇我们会详谈何谓范围链及他们的复写优先级. 范围Scope 我们先来看一个例子: var globalVar = 'global': function scopeFun(){ globalVar ="change in scopeFun": console.log("1.",globalVar)://1.change i

学习JS的心路历程-参数的传递(下)

今天我们要来探讨JS到底是透过何种参数传递方式呢? 废话不多说,上示例!! 我们先声明原始型别和物件型别来看看两者是否会有不一样的差异: var myStr = 'Hola': var myObj = {name:'Ann'}: 再来,声明另一个变量去复制他们: var myStr = 'Hola': var myObj = {name:'Ann'}: var copyStr = myStr: var copyObj = myObj: 然后,去修改复制过的变量内容并印出所有作比较: var my

Angular Material串串学客户端开发 2 - Node.js模块加载机制Require()

题外话解一下博客标题,因为第一篇文章评论中,有人质疑离题很远,说了半天和Angular Material没有半毛关系.其实我的的中心在后半句<串串学客户端开发>. require() 不要把这里的Require()和RequireJS混为一谈.不过有意思的是,Typescript的模块定义,甚至同时支持这两种模块机制. 导入和使用外部模块,只是简单的一句require(),看看angular/material/docs下的编译文件gulpfile.js的代码片段.对模块导入和使用有个直观的感觉

transport.js报hasOwnProperty对象不支持此属性

ECShop transport.js错误 这次出现的问题是transport.js在IE下提示对象不支持该用法.出现错误位置为608行的下面的代码: if(this.hasOwnProperty(k)){ 仔细看了一下代码,这个判断的主要作用应该是判断属性的.可能由于各浏览器的差异化,IE下就会出现不支持该用法的错误. 解决方法很简单,只要加多一个判断:if(this.hasOwnProperty&&this.hasOwnProperty(k)){ 就可以解决这个问题了. 究其原因在ie