前面讲了面向对象的封装,这章我们就来说一说继承

1.原型链

实现原型链有一种基本模式,其代码大概如下

<script>
function SuperType(){
this.property = true
}
SuperType.prototype.getSuperValue = function(){
return this.property;
}
function SubType(){
this.subproperty = false
}
//继承了 SuperType
SubType.prototype = new SuperType()
SuperType.prototype.getSubValue = function(){
return this.subproperty
}
var instance = new SubType()
alert(instance.getSuperValue()) /true
</script>

以上代码定义了两个类型,SuperType 和SubType 每个类型分别有一个属性和方法,SubType继承了SuperType,实现的本质是重写原型对象

原型链虽然很强大,可以用它来实现继承,但是也存在一些问题,引用类型的值会被的原型属性会被所有实例共享,通过下面代码说明问题

    //原型链的问题
function SuperType(){
this.colors = ["red", "blue", "green"]
}
function SubType(){}
//继承了SuperType
SubType.prototype = new SuperType()
var instance1 = new SubType()
instance1.colors.push("black")
alert(instance1.colors) //"red", "blue", "green","black"
var instance2 = new SubType()
alert(instance2.colors) //"red", "blue", "green","black"

  2.组合继承

function SuperType(name){
this.name = name;
this.colors = ['red', 'blue', 'green'];
}
SuperType.prototype.sayName = function(){
alert(this.name);
}
function SubType( name, age){
//继承属性
SuperType.call(this, name)
this.age= age
}
//继承方法
SubType.prototype = new SuperType()
SubType.prototype.constructor = SubType
SubType.prototype.sayAge = function(){
alert(this.age)
}

Javascript高级程序设计--读书笔记之面向对象(二)的更多相关文章

  1. Javascript高级程序设计--读书笔记之面向对象(一)

    哈哈哈万物皆对象,终于到了js的面向对象篇. 一.属性类型 (1)数据属性 数据属性包含一个数据值的位置,在这个位置可以写入和读取数值,数据属性有四个描述器行为的特性 [[Configurable]] ...

  2. javascript高级程序设计读书笔记-事件(一)

    读书笔记,写的很乱   事件处理程序   事件处理程序分为三种: 1.html事件2. DOM0级,3,DOM2级别  没有DOM1 同样的事件 DOM0会顶掉html事件   因为他们都是属性  而 ...

  3. javascript高级程序设计读书笔记----面向对象的程序设计

        创建对象   工厂模式 function createPerson(name, age, job){ var o = new Object(); o.name = name; o.age = ...

  4. javascript高级程序设计读书笔记

    第2章  在html中使用javascript 一般都会把js引用文件放在</body>前面,而不是放在<head>里, 目的是最后读取js文件以提高网页载入速度. 引用js文 ...

  5. 《JavaScript高级程序设计》笔记:面向对象的程序设计(六)

    面向对象的语言有一个标志,那就是它们都有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象. 理解对象 创建自定义对象的最简单的方法就是创建一个Object的实例,然后再为它添加属性和方法.例 ...

  6. Javascript高级程序设计读书笔记(第六章)

    第6章  面向对象的程序设计 6.2 创建对象 创建某个类的实例,必须使用new操作符调用构造函数会经历以下四个步骤: 创建一个新对象: 将构造函数的作用域赋给新对象: 执行构造函数中的代码: 返回新 ...

  7. JavaScript高级程序设计 读书笔记

    第一章 JavaScript 简介 第二章 Html中使用JavaScript 第三章 基本概念 第四章 变量,作用域,内存 第五章 引用类型 第六章 面向对象 第七章 函数表达式 第八章 BOM 第 ...

  8. JavaScript高级程序设计-读书笔记(7)

    第22章 高级技巧 1.高级函数 (1)安全的类型检测 在任何值上调用Object原生的toString()方法,都会返回一个[object NativeConstructorName]格式的字符串. ...

  9. JavaScript高级程序设计-读书笔记(2)

    第6章 面向对象的程序设计 创建对象 1.最简单方式创建Object的实例,如 var person = new Object(); person.name = “Greg”; person.age ...

随机推荐

  1. 【记录】Mybatis-Generator 数据层代码生成器,自动生成dao类,mapper,pojo类

    Mybatis-Generator 工具来帮我们自动创建pojo类.mapper文件以及dao类并且会帮我们配置好它们的依赖关系. 官方文档地址:http://mybatis.org/generato ...

  2. 转载:java面试题(二)

    这部分主要是开源Java EE框架方面的内容,包括Hibernate.MyBatis.Spring.Spring MVC等,由于Struts 2已经是明日黄花,在这里就不讨论Struts 2的面试题, ...

  3. C++ 之获取map元素[转]

    链接:https://www.cnblogs.com/jianfeifeng/p/11089799.html 对于map对象, count成员返回值只能是0或者1,map容器只允许一个键对应一个实例. ...

  4. SpringMvc返回给前端数据@ResponseBody响应体【支持Ajax】

    1).在Controller中写 //@ResponseBody响应体是jackson包提供的 用于将Controller的方法返回的对象,通过HttpMessageConverter接口转换为指定格 ...

  5. Spring 讲解(六)

    如何理解 Spring 中的 AOP 一.AOP 的概述 AOP(Aspect Oriented Programming):面向切面编程,通过预编译方式和运行期动态代理来实现程序功能的统一维护的一种技 ...

  6. 【JavaWeb项目】一个众筹网站的开发(三)第一个网页

    一.bootstrap 本项目采用bootstrap3 bootstrap中文网 https://www.bootcss.com/ 使用bootstrap三步: 1.导入jQuery 2.导入boot ...

  7. 【leetcode】942. DI String Match

    题目如下: Given a string S that only contains "I" (increase) or "D" (decrease), let  ...

  8. leetcode-166周赛-5280-用户分组

    题目描述: 自己的提交: class Solution: def groupThePeople(self, groupSizes: List[int]) -> List[List[int]]: ...

  9. vi快捷操作

    全部删除: 按esc键后,先按gg(到达顶部),然后dG 全部复制: 按esc键后,先按gg,然后ggyG 全选高亮显示: 按esc键后,先按gg,然后ggvG或者ggVG 单行复制: 按esc键后, ...

  10. vue基础八

    表单控件绑定 1.基础用法 你可以用 v-model 指令在表单控件元素上创建双向数据绑定.尽管有些神奇,但 v-model 本质上不过是语法糖,它负责监听用户的输入事件以更新数据,并特别处理一些极端 ...