谈谈JavaScript中继承方式
function Parent(param) {
this.name = 'parent'
this.otherName = 'otherName'
this.param = param || 'param'
}
Parent.prototype.sayName = function() {
console.log('this.name :', this.name)
}
function Son() {
this.name = 'son'
}
Son.prototype = new Parent() // 继承
let newSon1 = new Son()
let newSon2 = new Son() console.log('newSon1 :', newSon1) // newSon1 : Parent { name: 'son' }
// newSon1 : Parent { name: 'parent', otherName: 'otherName' } // newSon1.__proto__ 指向构造函数 Son 的原型 prototype
console.log('newSon1 :', newSon1.__proto__)
// newSon1.__proto__ 指向构造函数 Son 的原型 prototype
// Son 的 prototype 赋值为 new Parent(),所以 Son 的构造函数不是自己,而是 Parent
// newSon1.__proto__.constructor : function Parent() {
// this.name = 'parent'
// this.otherName = 'otherName'
// }
console.log('newSon1.__proto__.constructor :', newSon1.__proto__.constructor) console.log('newSon2 :', newSon2) // newSon1 : Parent { name: 'son' }
// newSon2 : Parent { name: 'parent', otherName: 'otherName' } // newSon2.__proto__ 指向构造函数 Son 的原型 prototype
console.log('newSon2 :', newSon2.__proto__) // 修改 newSon1 继承而来的 otherName 属性, newSon2也发生了变化
newSon1.__proto__.otherName = 'son1-OtherName'
console.log('newSon1.otherName :', newSon1.otherName)
console.log('newSon2.otherName :', newSon2.otherName)
缺点:
function Parent() {
this.name = 'parent'
this.otherName = 'otherName'
}
Parent.prototype.sayName = function() {
console.log('this.name :', this.name)
}
function Son(param) {
Parent.call(this, param) // 继承
}
function Parent() {
this.name = 'parent'
this.otherName = 'otherName'
}
Parent.prototype.sayName = function() {
console.log('this.name :', this.name)
}
function Son(param) {
Parent.call(this, param)
}
Son.prototype = Parent.prototype
Son.prototype.constructor = Son // 修改构造函数为自己
function Parent() {
this.name = 'parent'
this.otherName = 'otherName'
}
Parent.prototype.sayName = function() {
console.log('this.name :', this.name)
}
function Son(param) {
Parent.call(this, param)
}
deepCopy(Son.prototype, Parent.prototype)
Son.prototype.constructor = Son // 修改构造函数为自己
function deepCopy(target, obj) {
for (const prop in obj) {
if (obj.hasOwnProperty(prop)) {
if (typeof obj[prop] === 'object') {
target[prop] = Object.prototype.toString.call(obj[prop]) === '[object Array]' ? [] : {}
deepCopy(target[prop], obj[prop])
} else {
target[prop] = obj[prop]
}
}
}
}
谈谈JavaScript中继承方式的更多相关文章
- javascript中继承方式及优缺点(一)
分别介绍原型链继承.call/apply继承(借用构造函数继承).组合继承.原型式继承.寄生式继承.寄生组合式继承 1. 原型链继承 核心:将父类的实例作为子类的原型 function SuperTy ...
- javascript中继承方式及优缺点(三)
文以<JavaScript高级程序设计>上的内容为骨架,补充了ES6 Class的相关内容,从我认为更容易理解的角度将继承这件事叙述出来,希望大家能有所收获. 1. 继承分类 先来个整体印 ...
- javascript中继承方式及优缺点(二)
一.原型链继承 方式1: 原型链继承 (1)流程: 1.定义父类型构造函数. 2.给父类型的原型添加方法. 3.定义子类型的构造函数. 4.创建父类型的对象赋值给子类型的原型. 5 ...
- 谈谈javascript中的prototype与继承
谈谈javascript中的prototype与继承 今天想谈谈javascript中的prototype. 通常来说,javascript中的对象就是一个指向prototype的指针和一个自身的属性 ...
- Javascript中继承
Javascript中继承 构造函数继承 原型继承 call和apply继承 组合继承
- javascript 中继承实现方式归纳
转载自:http://sentsin.com/web/1109.html 不同于基于类的编程语言,如 C++ 和 Java,javascript 中的继承方式是基于原型的.同时由于 javascrip ...
- 实现JavaScript中继承的三种方式
在JavaScript中,继承可以通过三种手法实现原型链继承 使用apply.call方法 对象实例间的继承. 一.原型链继承 在原型链继承方面,JavaScript与java.c#等语言类似 ...
- 谈谈javascript中原型继承
什么是继承?拿来主义:自己没有,别人有,把别人的拿过来使用或者让其成为自己的 如何实现继承的方式 原型继承 混入继承 经典继承 1. 混入继承 由于一个对象可以继承自任意的对象,即:o可以继承自对象o ...
- javascript中继承(一)-----原型链继承的个人理解
[寒暄]好久没有更新博客了,说来话长,因为我下定决心要从一个后台程序员转为Front End,其间走过了一段漫长而艰辛的时光,今天跟大家分享下自己对javascript中原型链继承的理解. 总的说来, ...
随机推荐
- Ext.isIterable
Ext.isIterable用于判断传入的参数是否为可迭代的 在这4种情况下,函数返回true 1:数组2:函数参数arguments3:HTML collections : NodeList4:HT ...
- 超级有爱的五款APP共享 可以让你神操作
随着科技的不断发展,手机功能的不断完善,让我们更加依赖手机,不得不说手机给我们带来很多的乐趣和方便. 今天就主要给大家分享五款超级有爱的APP软件,感兴趣的小伙伴已经迫不及待了吧! 荔枝 荔枝是一款声 ...
- Linux安装配置Mariadb
一.安装数据库Mariadb 参考:http://blog.51cto.com/12173069/2047746 从最新版本的linux系统开始,默认的是 Mariadb而不是mysql! 使用系统自 ...
- 数据库:MySQL实战;左链接;查询WordPress数据库中的文章内容
在1年前,我用学生价租了一个阿里云服务器(是真的便宜啊),自己在CentOS系统上用命令行搭了个WordPress的环境,开始了为期一个月使用自建博客的历程. 事实证明,博客在类似博客园这样的平台上写 ...
- MyDAL - is null && is not null 条件 使用
索引: 目录索引 一.API 列表 C# 代码中 instance.property == null 生成 SQL 对应的 is null : 如:.Queryer<Agent>() .. ...
- AngularJS学习之旅—AngularJS 模块(十五)
一.AngularJS 模块 模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 1.创建模块 通过 AngularJS 的 angular ...
- .Net Core 在Linux服务器下部署程序--(4). 前端ReactWeb应用部署
确认第二步中的软件已经安装完成 Nodejs前端Web服务器 Zip与UnZip压缩包软禁 nrm前端包源管理器 PM2前端Web程序守护进程 创建部署文件夹 如果已经执行过( 3. 租户平台后端程序 ...
- Python基础之元组
元组初识 元组的认识 首先,我们来认识一下元组: # 定义一个元组 uesr_tuple = ("zhangsan", "lisi", "wangwu ...
- git常用命令说明教程
git常用命令说明教程 git介绍 是一个分布式的,版本控制软件.每台使用git的电脑都是一个分版本库.svn是集中管理的. 安装git 一 git相关操作 1.官网下载最新版安装https://gi ...
- SQL insert into select 语句
遇到权限数据变更的需要批量到别的平台, 在175平台添加一个权限需要, 批量到别的现有平台, 以后的建站, 会把sql放到自动建站里面; 权限的 insert into select 表一: `ous ...