JS如何创建对象及实现继承

以下整理自《JAVASCRIPT高级程序设计》

【原型】
1. 什么是原型？
我们创建的每一个函数都有一个prototype(原型)属性，这个属性是一个对象，
它的用途是包含有特定类型的所有实例共享的属性和方法。

2. 只要创建了一个新函数，就会为该函数创建一个prototype属性。
在默认情况下，所有prototype属性都会自动获得一个constructor(构造函数)属性，
这个属性包含一个指向prototype属性所在函数的指针。
这样，函数及函数原型之间形成了循环指向。

3. 每当调用构造函数创建一个新实例后(即"new constructor()"这样的形式)，
该实例的内部将包含一个指针(一般名为__proto__)，指向构造函数的原型属性。

【创建】
组合使用构造函数和原型模式
特点：
实例属性在构造函数中定义
共享属性和共享方法在原型中定义

function Person(name) {

this.name = name;

}

Person.prototype = {

constructor: Person, //强制声明构造函数，默认是Object

sayName : function() {

alert(this.name);

}

var Person1 = new Person("king");

【继承】
组合继承模式

//父类

function SuperType(name) {

this.name = name;

}

SuperType.prototype.sayName = function() {

alert(this.name);

};

//子类

function SubType(name, age) {

SuperType.call(this, name); //继承父类的属性

this.age = age;

}

SubType.prototype = new SuperType(); //继承父类方法

SubType.prototype.sayAge = function() {

alert(this.name);

};

var SubType1 = new SubType("king", 88);

call(obj [, args])方法的含义：我们知道，在面向对象的语言中，对象的方法通常有一个隐藏的参数this，用来指明具体的对象。

在js中，call方法实现了上面的效果，A.x.call(B)实际上是指在B对象上调用方法x。

与call方法类似的还有apply方法，两者的不同是apply只有两个参数，第一个参数与call相同，第二个参数是一个参数数组。

========================================

PS: new操作符创建实例的过程
1. 创建一个新对象
2. 将构造函数的作用于赋给新对象(因此this就指向了这个新对象)
3. 执行构造函数的代码(为这个新对象添加属性)
4. 返回新对象

时间： 2024-12-21 02:05:58

JS如何创建对象及实现继承的相关文章

js中的原型、继承的一些想法

最近看到一个别人写的js类库,突然对js中的原型及继承产生了一些想法,之前也看过其中的一些内容,但是总不是很清晰,这几天利用空闲时间,对这块理解了一下,感觉还是有不通之处,思路上没那么条理,仅作为分享, 一.instanceof 在JavaScript有instanceof运算符,是二元运算符,使用方法 instanceA instanceof A,返回值是布尔值(boolean),含义是判断instanceA是否是A的一个实例,其实质是判断A.prototype===instanceA.__p

JS学习笔记03-初识继承

<!DOCTYPE HTML> <html lang="en"> <head> <meta charset="UTF-8"> <title>test</title> <style type="text/css"> </style> </head> <body> <script type="text/javascr

JS如何创建对象和继承对象

JS创建对象的几种方法:工厂模式,构造函数模式,原型模式,混合模式,动态原型模式 1 在工厂模式中,在构造函数内部创建一个新对象,最后返回这个对象.当实例化时,我们不需要用new关键字,就像调用方法一样就可以实例化. 工厂模式的缺点是容易和普通函数混淆,只能通过命名来确认它是一个构造函数.不推荐使用这种模式. //factory pattern function createPerson(name, age, job){ var o = {}; o.name = name;

JS中有关对象的继承以及实例化、浅拷贝深拷贝的奥秘

一.属性的归属问题 JS对象中定义的属性和方法如果不是挂在原型链上的方法和属性(直接通过如类似x的方式进行定义)都只是在该对象上,对原型链上的没有影响.对于所有实例共用的方法可直接定义在原型链上这样实例化的的时候就不用对每个实例定义该属性方法,所有的实例均具有该方的引用见最后的输出. function Myclass(){ this.x=" x in Myclass"; this.get=function(){}//每次实例化对象,每个对象的该方法都是独立的,是不相同的 } Mycla

【JS复习笔记】03 继承

关于继承好吧,说到底JS还是原型继承的,而不是类继承.所以在这个上面要经常用到prototype去继承另一个对象. 所有的构造器函数都约定命名为首字母大写的形式,并且不以首字母大写的形式拼写任何其它的东西.当然一个更好的备选方案是根本就不用new.(太棒了,你说什么就是什么咯,我就当JS没这个东西了) 为什么呢,因为伪类模式就是一种画虎不成反类犬的模式,它试图去迎合我们这些玩类继承的程序员,但是其实它还有更多更好的选择. 那就是原型继承,然后创建对象的时候函数化,这样就可以对创建有私有变量的对

JS面向对象，原型，继承

ECMAScript有两种开发模式:1.函数式(过程化),2.面向对象(OOP).面向对象的语言有一个标志,那就是类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.但是,ECMAScript没有类的概念,因此它的对象也与基于类的语言中的对象有所不同.var box = new Object();box.name = 'Lee';box.age = 100;box.run = function(){ return this.name + this.age + '运行中...'; //th

JS面向对象（封装，继承）

在六月份找工作中,被问的最多的问题就是: js面向对象,继承,封装,原型链这些,你了解多少? 额,,,我怎么回答呢, 只能说,了解一些,不多不少,哈哈哈哈,当然,这是玩笑话. 不过之前学过java,来理解这些还是很容易的. 所以趁着自己空闲的时间,理一理,,这些,, 一.封装 1.原始方法 1 // 通过new关键字生成一个对象,然后根据javascript是动态语言的特性来添加属性和方法,构造一个对象.其中this表示调用该方法的对象. 2 var obj = new Object(); 3

JS面向对象，创建，继承

1 创建一个面向对象 var obj = new Object(); //创建一个空对象obj.name = 'haha'; obj.showName = function(){ alert(obj.name); } obj.showName(); 缺点:当我们想创建多个面向对象的时候,重复代码过多,需要封装,所以有了下面的方法 2 工厂方式 function CreatePerson(name){ //原料 var obj = new Object(); //加

关于js中原生构造函数的继承

前言最近参加了蚂蚁金服的面试,一个关于js继承的问题答的不是特别好.在如今快节奏的工作当中,很多基础的东西会渐渐被丢掉.就如继承这个话题,写React的同学应该都是class xxx extends React.Component,然而这可以理解为es5的一个语法糖,所以问题又回到了js如何实现继承.面试结束后,赶紧翻了翻积满灰尘的js高级程序设计,重新学习了一遍面向对象这一章,有一个创建对象的模式吸引到了我. 寄生构造函数模式在oo中我们是通过类去创建自定义类型的对象,然而js中没有类的概