javascript中继承(二)-----借用构造函数继承的个人理解

本人目录如下: 零.寒暄&回顾一,借用构造函数二.事件代理三,call和apply的用法四.总结零.寒暄&回顾上次博客跟大家分享了自己对原型链继承的理解,想看的同学欢迎猛击这里,上次说到原型链继承有一些问题,主要是两方面的.我们举个栗子来说明下: Q1:共享的超类属性能被任何实例改写,这个是很危险的!看下面一段代码: function Person(name){ this.name=name; this.countries=["America","…

javascript实现继承3种方式：原型继承、借用构造函数继承、组合继承，模拟extends方法继承

javascript中实现继承的三种方式:原型继承.借用构造函数继承.混合继承: /* js当中的继承 js中构造函数原型对象实力对象的关系: 1 构造函数.prototype = 原型对象 2 原型对象.constructor = 构造函数(模板) 3 原型对象.isPrototypeOf(实例对象) 判断实例对象的原型是不是当前对象 4 构造函数实力对象是类和对象的关系 */ /* 1 原型继承给子类构造函数的原型对象赋值为父类构造函数的实例赋值之后产生的关系: 1 子类的原…

js继承之借用构造函数继承

我的上一篇文章介绍了,原型链继承模式.但是单纯的原型链模式并不能很好地实现继承. 一.原型链的缺点 1.1 单纯的原型链继承最大的一个缺点,来自于原型中包含引用类型的值. 本来,我们没有通过原型链实现继承前,子类的所有实例都共享着原型上的所有属性和方法.通过子类实例,可以访问原型上的属性,但是,不能重写原型上的属性. //定义一个学生类 function Student(stuID, schoolName) { this.stuID = stuID; this.schoolName = scho…

js继承之组合继承（结合原型链继承和借用构造函数继承）

在我的前两篇文章中,我们已经介绍了 js 中实现继承的两种模式:原型链继承和借用构造函数继承.这两种模式都存在各自的缺点,所以,我们考虑是否能将这二者结合到一起,从而发挥二者之长.即在继承过程中,既可以保证每个实例都有它自己的属性,又能做到对一些属性和方法的复用.这样就 perfect 了. 一.回顾借用构造函数继承的缺点先看我们之前在借用构造函数继承中最后用到的代码: //父类:人 function Person () { this.head = '脑袋瓜子'; this.emotion =…

JS继承之借用构造函数继承和组合继承

根据少一点套路,多一点真诚这个原则,继续学习. 借用构造函数继承在解决原型中包含引用类型值所带来问题的过程中,开发人员开始使用一种叫做借用构造函数(constructor stealing)的技术(有时候也叫做伪造对象或经典继承).这种技术的基本思想相当简单,即在子类型构造函数的内部调用超类型构造函数. 基本模式 function SuperType(){ this.colors = ["red", "blue", "green"]; } fu…

javascript继承之借用构造函数与原型

javascript继承之借用构造函数与原型在js中,关于继承只有利用构造函数和原型链两种来现实.以前所见到的种种方法与模式,只不过是变种罢了. 借用构造函数 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 // 一个动物类,包含名字和性别属性 function Animal (name, sex) { this.name = name; this.sex = sex; this.getName = fu…

JS高阶---继承模式（借用构造函数继承+组合继承）

(1)借用构造函数继承案例如下: 验证: (2)组合继承案例如下: 验证如下: 结果如右图所示 . .…

JavaScript各种继承方式（二）：借用构造函数继承（constructor stealing）

一原理在子类的构造函数中,通过call ( ) 或 apply ( ) 的形式,调用父类的构造函数来实现继承. function Fruit(name){ this.name = name; this.eat = function(){ console.log('eat'); }; } Fruit.prototype.desc = function(){ console.log('desc'); }; function Mango(name,level){ Fruit.call(this,n…

Javascript中，实现类与继承的方法和优缺点分析

Javascript是一种弱类型语言,不存在类的概念,但在js中可以模仿类似于JAVA中的类,实现类与继承第一种方法:利用Javascript中的原型链 //首先定义一个父类 function Animal(name,age){ //定义父类的属性 this.name = name || "Animal"; this.age = age ; //定义父类的方法 this.sleep = function(){ console.log("这只"+this.name+…

JavaScript中的原型链和继承

理解原型链在 JavaScript 的世界中,函数是一等公民. 上面这句话在很多地方都看到过.用我自己的话来理解就是:函数既当爹又当妈."当爹"是因为我们用函数去处理各种"粗活累活"(各种工具函数.页面交互.业务逻辑等):"当妈"是因为函数还会"生孩子"(创建对象). 在 JavaScript 的世界中,每一个对象都有一个隐藏的__proto__属性.这个属性指向生成这个对象的构造函数的原型(prototype).事实上,所…

javascript中的对象创建与继承

js是一门基于原型的面向对象语言,与传统的面向对象如Java,C#相比,它在对象创建及继承上有自己独特的实现方式,本文主要描述js中对象创建及继承的一些实践. 1.对象创建方式一:工厂模式创建对象 <script> function createPerson(name,age,job) { var o=new Object(); o.name=name; o.age=age; o.job=job; o.sayName=function(){ alert(this.name); }; retu…

JavaScript中的原型 property 构造函数和实例对象之间的关系

1 为什么要使用原型? /* * javascript当中原型 prototype 对象 * * */ //首先引入 prototype的意义,为什么要使用这个对象 //先来写一个构造函数的面向对象实例 function Person(name ){ this.name = name; this.show = function(){ return this.name; }; } //实例化两个对象 p1 = new Person("a"); p2 = new Person("…

[译]在Javascript中制造二维数列

本文翻译youtube上的up主kudvenkat的javascript tutorial播放单源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU&list=PL6n9fhu94yhUA99nOsJkKXBqokT3MBK0b Javascript中并不存在直接制造二维数列的方法,所以我们其实只是制作一个包含着数列的数列而已例子:以下的Javascript代码制造一个3x3的二维数列 for (i=0; i [ 3; i++) myArray…

javascript继承之借用构造函数(二)

//简单的函数调用 function Father() { this.nums= [1,2]; } function Son() { Father.call(this);//调用超类型,完成son继承father } var s1 = new Son(); s1.nums.push("yellow"); alert(s1.nums);//red,black,yellow var s2 = new Son(); alert(s2.nums); //red,black 每次实例化son的时…

javascript中的二维数组

要创建一个二位数组我们脑子里第一个出现的就是 var arr=[][]; 但是在javascript这样是会报错的,要在javascrip中创建一个二位数组对象方法如下方法一直接把数组写出来例如 var c = [[ ],[ ],[ ]] 方法二利用循环创建的方法 var c=new Array( ); for (var k = 0; k<4;k++){ c[i]=new Array( ); }…

6.javaScript中的二维数组

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> //声明一维数组 var myarr = new Array(); for (var i = 0; i < 3; i++) { //确定一维数组的长度. myar…

JavaScript 中 new 关键字结合构造函数创建对象

步骤: new会在内存中创建一个新的空对象 new 会让this指向这个新的对象执行构造函数(给这个新对象添加属性和方法) new会返回这个新对象…

JavaScript中给二维数组动态添加元素的质朴方法

var myData = new Array(); for(var i=0;i<tableDatas.length;i++){ var arr=tableDatas[i]; ...... /// myData[i]=new Array(); myData[i][0]=arr[2].toString(); myData[i][1]=parseFloat(arr[3]); } drawGraph(myData); 如上,采取是元素赋值的方式,push的做法用不通,如果你知道请留言.…

javascript中call()、apply()、bind()的用法理解

一.bind的用法第一个:obj.showInfo('arg','arg_18');中传的2个参数通过showInfo方法改变的是obj下中的name和age 第二个:obj.showInfo.bind(this)('bind','bind_18');中bind要传的name和age是通过一个一个传的形式,然后通过showInfo方法改变的是window下的name和age 注:bind 返回的是一个新的函数,你必须调用它才会被执行二.apply的用法第一个:obj.showInfo('a…

JavaScript中的显示原型和隐形原型（理解原型链）

显式原型:prototype 隐式原型:__proto__ 1.显式原型和隐式原型是什么? 在js中万物皆对象,方法(Function)是对象,方法的原型(Function.prototype)是对象,对象具有属性(__proto__)称为隐式原型,对象的隐式原型指向构造该对象的构造函数的显式原型. 方法(Function)是一个特殊的对象,除了和其他对象一样具有__proto__属性以外,它还有一个自己特有的原型属性(prototype),这个属性是一个指针,指向原型对象.原型对象也有一个属性…

对JavaScript中的静态属性和原型属性的理解

首先是在访问上的区别,当访问实例对象的某个属性但它本身没有时,它就会到原型中去查找,但不会去查找静态属性. // 实例对象不会去查找静态属性 function Foo(){} Foo.a = 1; var foo = new Foo(); foo.a // undefined // 当实例对象没有某个属性时,会尝试去原型中查找 function Foo(){} Foo.prototype.a = 1; var foo = new Foo(); foo.a // 1 静态方法中的this指向调用它…

javascript中继承方式及优缺点(一)

分别介绍原型链继承.call/apply继承(借用构造函数继承).组合继承.原型式继承.寄生式继承.寄生组合式继承 1. 原型链继承核心:将父类的实例作为子类的原型 function SuperType(){ this.property = true; } SuperType.prototype.getSuperValue = function(){ return this.property; }; function SubType(){ this.subproperty = false; }…

js继承之原型链继承

面向对象编程都会涉及到继承这个概念,JS中实现继承的方式主要是通过原型链的方法. 一.构造函数.原型与实例之间的关系每创建一个函数,该函数就会自动带有一个 prototype 属性.该属性是个指针,指向了一个对象,我们称之为原型对象.什么是指针?指针就好比学生的学号,原型对象则是那个学生.我们通过学号找到唯一的那个学生.假设突然,指针设置 null, 学号重置空了,不要慌,对象还存在,学生也没消失.只是不好找了. 原型对象上默认有一个属性 constructor,该属性也是一个指针,指向其相…

JavaScript中的面向对象程序设计

本文内容目录顺序: 1.Object概念讲述: 2.面向对象程序设计特点: 3.JavaScript中类和实例对象的创建: 4.原型概念: 5.原型API: 6.原型对象的具体使用:7.深入理解使用原型对象实现继承:8.多态:override—重写 1.Object概念讲述: 面向对象程序设计我们首先要明白什么是对象,我在在引用数据类型中也说明了关于对象的这一概念:所以开篇我首先讲述一下对象的概念[Object——对象]: 什么是对象:对象就是存储一个事物的属性和功能的一块存储空间,在起一个名字…