js 实现继承
我们现在要做的一件事情是像其他语言的面向对象一下实现继承多态
具体要求如下:
一个 Father 构造函数,一个 Child 构造函数,其中改写 Father中的部分参数, new Child() 表示出一个新的child
var Father = function (name) {
this.name = name
this.say = function () {
console.log('i am ' + name)
}
} var Child = function (name,age) {
this.age = age;
this.say = function () {
console.log("name:" + this.name + " and age:" + this.age);
}
}
Child.prototype = new Father()
var he = new Child('asd',)
console.log(he.firstName) // qiao
console.log(he.name)
console.log(he.age)
he.say()
无法输出 name 是因为不能穿参数
var Father = function (name) {
this.name = name
this.firstName = 'qiao'
this.say = function () {
console.log('i am ' + name)
}
}
var Child = function (name,age) {
this.tempMethod = Father
this.tempMethod(name)
this.age = age;
this.say = function () {
console.log("name:" + this.name + " and age:" + this.age);
}
} var he = new Child('asd',)
console.log(he.firstName) // qiao
console.log(he.name) // sad
console.log(he.age) //
he.say() // name:undefined and age:12
这样书写就可以继承name了
利用call可以这样书写
var Child = function (name,age) {
Father.call(this,name)
this.age = age
this.say = function(){
console.log('i am ' + name +'and age '+ age )
}
}
利用apply的话会更加巧妙一点,不用管参数是什么
var Child = function (name,age) {
Father.apply(this,arguments)
this.age = age
this.say = function(){
console.log('i am ' + name +'and age '+ age )
}
}
但是这样写虽然实现了继承,但是却没有利用原型进行继承,所以只是一种表面上的继承,实际上并没有原型上的联系,下面是如何利用原型进行继承
var Iphone = function () {
this.price =
} var IphoneX = function () {
this.say = function(){
console.log('i am more expensive');
}
}
IphoneX.prototype = Iphone.prototype;
var a = new IphoneX()
现在最新出的js class可以很优雅的实现这个
class Iphone {
constructor() {
this.price =
}
}
class IphoneX extends Iphone {
say() {
console.log('expensive');
}
}
var a = new IphoneX();
a.say()
console.log(a.price)
js 实现继承的更多相关文章
- JS对象继承篇
JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person() ...
- js实现继承的5种方式 (笔记)
js实现继承的5种方式 以下 均为 ES5 的写法: js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承 ...
- js实现继承的方式总结
js实现继承的5种方式 以下 均为 ES5 的写法: js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承 ...
- 【09-23】js原型继承学习笔记
js原型继承学习笔记 function funcA(){ this.a="prototype a"; } var b=new funcA(); b.a="object a ...
- js实现继承的两种方式
这是面试时面试官会经常问到问题: js的继承方式大致可分为两种:对象冒充和原型方式: 一.先说对象冒充,又可分为3种:临时属性方式.call().apply(): 1.临时属性方式: 当构造对象son ...
- js实现继承
js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承有以下通用的几种方式1.使用对象冒充实现继承(该种实现 ...
- 浅谈JS的继承
JS继承 继承是OO语言中最为人津津乐道的概念,许多OO语言都支持两种方式的继承:接口继承:实现继承. 接口继承:只继承方法签名. 实现继承:继承实际的方法. 由于ES里函数没有签名,所以在ES里面无 ...
- JS类继承常用方式发展史
JS类继承常用方式发展史 涉及知识点 构造函数方式继承 1-继承单个对象 1.1 多步走初始版 1.2 多步走优化版 1.3 Object.create()方式 2-继承多个对象 2.1 遍历 Obj ...
- js实现继承的5种方式
js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承有以下通用的几种方式1.使用对象冒充实现继承(该种实现 ...
- JS原型继承与类的继承
我们先看JS类的继承 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...
随机推荐
- Caffe系列3——制作Hdf5数据源详细教程(手把手教你制作Hdf5数据源)
制作Hdf5数据源详细教程
- 关系型数据库——MySQL
[MySQL架构图] MySQL简要架构图如下图所示,引擎层以插件方式集成了不同的存储引擎,它们共用Server层对外提供服务. 连接器:用于连接管理,进行身份认证及权限相关的管理.(登录MySQ ...
- [NOIP2019模拟赛]夹缝
夹缝 问题描述: 二维空间内有两面相对放置的,向无限远延伸的镜子,以镜子的方向及其法向量建立坐标系,我们选定一个法向量方向下面称“上”.在镜子上的整数位置,存在着一些传感器,传感器不影响光线的反射,光 ...
- 多项式模板&题目整理
注:多项式的题目,数组应开:N的最近2的整数次幂的4倍. 多项式乘法 FFT模板 时间复杂度\(O(n\log n)\). 模板: void FFT(Z *a,int x,int K){ static ...
- leetcode-买卖股票最佳时机含冷冻期
题目描述: 方法一: class Solution: def maxProfit(self, prices: List[int]) -> int: n = len(prices) dp_i_0 ...
- 「题解」:[组合数学]:Perm 排列计数
题干: Description称一个1,2,…,N的排列P1,P2…,Pn是Magic的,当且仅当2<=i<=N时,Pi>Pi/2. 计算1,2,…N的排列中有多少是Magic的,答 ...
- CF1158F Density of subarrays
CF1158F Density of subarrays 首先可以发现,有值的p最大是n/c 对于密度为p,每个数至少出现c次,且其实是每出现c个数,就分成一段,这样贪心就得到了p %ywy n/c ...
- 洛谷P5104 红包发红包
题目链接: P5104 题目分析: 题目和\(n\)是没什么关系的,因为是\(n\)个人抢,其实不一定抢完 其实很显然--就是求一个连续型随机变量的期望 首先设一个随机变量\(X\),表示第一个人拿到 ...
- PAT甲级——A1076 Forwards on Weibo
Weibo is known as the Chinese version of Twitter. One user on Weibo may have many followers, and may ...
- 很好用的API管理--Swagger
1.打开NuGet程序包 2.安装下面两个程序包 3.安装完后会出现SwaggerConfig.cs类,并修改里面的内容 代码: [assembly: PreApplicationStartMetho ...