js原生继承之——构造函数式继承实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>constructorfunctionInherit</title>
<script type="text/javascript">
//声明父类
function superClass(id){
this.id = id;
this.books = ['html','css','js'];
}
superClass.prototype.getBooks = function(){
console.log(this.books);
}
//声明子类
function subClass(id){
superClass.call(this,id);//让子this指向父this，后面带的是父类需传入的参数id
}
// subClass.prototype.getSubName = function(){
// console.log(this.id);
// }
//实例化对象测试
var test1 = new subClass(1);
var test2 = new subClass(2);
test2.books.push('php');//test2插入的数据'php'不影响test1
console.log(test1.id); //1
console.log(test1.books); //["html", "css", "js"]
console.log(test2.id); //2
console.log(test2.books); //["html", "css", "js", "php"]
//注：构造函数式继承是访问不到父原型链上的属性和方法的
test1.getBooks(); //报错：undefined is not a function
//本例已经通过验证
</script>
</head>
<body>
</body>
</html>
js原生继承之——构造函数式继承实例的更多相关文章
- js原生设计模式——2面向对象编程之继承—call(this)构造函数式继承
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- js原生设计模式——2面向对象编程之继承—原型继承(类式继承的封装)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- js原生设计模式——2面向对象编程之继承—new类式继承
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- js原生设计模式——2面向对象编程之继承—new+call(this)组合式继承
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- js原生设计模式——2面向对象编程之继承—多继承
1.单对象克隆 <!DOCTYPE html><html lang="en"><head> <meta charset=" ...
- JS面向对象编程之：封装、继承、多态
最近在实习公司写代码,被隔壁的哥们吐槽说,代码写的没有一点艺术.为了让我的代码多点艺术,我就重新温故了<javascript高级程序设计>(其中几章),然后又看了<javascrip ...
- js原生继承几种方式
js原生继承 js本身并没有继承和类的概念,本质上是通过原型链(prototype)的形式实现的. 1.先写两个构造函数Parent和Child,用于将Child继承Parent function P ...
- js原型链理解(3)--构造借用继承
构造借用(constructor strealing) 1.为什么已经存在原型链继承还要去使用构造借用 首先看一下这个例子 function Super(){ this.sets = [0,1,2]; ...
- JS原型继承和类式继承
前言 一个多月前,卤煮读了一篇翻译过来的外国人写的技术博客.此君在博客中将js中的类(构造)继承和原型继承做了一些比较,并且得出了结论:建议诸位在开发是用原型继承.文中提到了各种原型继承的优点,详细的 ...
随机推荐
- ExtJS的4.1新特性简要介绍
ExtJS的4.1新特性简要介绍 一.动态加载机制 Ext.require动态加载任何类,并且会加载依赖类: 二.新类系统 •类定义:ExtJS4.0以后应入了Ext.define方法,他通过类的字符 ...
- Android网络开发之OkHttp--基本用法POST
1.OkHttp框架使用了OkIo框架,不要忘记下OkIo.jar 2.通过POST访问网络,和通过GET访问网络基本相同,多了设置请求参数的过程.主要分为五步: (1).声明并实例化一个OkHttp ...
- 自动化运维工具Ansible详细部署
本文来源:http://sofar.blog.51cto.com/353572/1579894/ 前言 一个由 Python 编写的强大的配置管理解决方案.尽管市面上已经有很多可供选择的配置管理解决方 ...
- Mysql 技巧
order by条件: SELECT * FROM tablename WHERE id_one=27 OR id_two=27 ORDER BY CASE WHEN id_one=27 THEN t ...
- android4.0 的图库Gallery2代码分析(四) 之相册的数据处理以及显示
最近迫于生存压力,不得不给人兼职打工.故在博文中加了个求点击的链接.麻烦有时间的博友们帮我点击一下.没时间的不用勉强啊.不过请放心,我是做技术的,肯定链接没病毒,就是我打工的淘宝店铺.嘻嘻.http: ...
- android里uri和url的区别
URI :是从虚拟根路径开始的 URI,是uniform resource identifier URL:是整个链接 URI,是uniform resource location uri:file: ...
- HDU 2489 Minimal Ratio Tree 最小生成树+DFS
Minimal Ratio Tree Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Other ...
- PHP 删除非法UTF-8字符
//reject overly long 2 byte sequences, as well as characters above U+10000 and replace with ? $some_ ...
- SVN参考命令
SVN 命令参考(svn command reference) 用法: svn <subcommand> [options] [args]Subversion 命令行客户端,版本 1.6. ...
- 一个很好玩的命令：stty
stty命令修改终端命令行的相关设置.语法stty(选项)(参数)选项-a:以容易阅读的方式打印当前的所有配置:-g:以stty可读方式打印当前的所有配置.参数终端设置:指定终端命令行的设置选项.实例 ...