js 中继承常用的几种方法

继承

继承：就是指一个对象有权去访问另一个对象的成员属性

作用是实现代码的复用

继承的方式：只要能实现一个对象有权访问另一个对象成员的方式都可以成为是实现继承的方式

3 .继承是对象与对象之间的关系

4.原型的方法就是给继承使用的

#### 继承的实现方式 4种方法

① 扩展原有的原型

function Parent(name,age){

this.name=name;

this.age=age;

}

function Child(){

}

var p=new Parent('小红',19);

Child.prototype.name=p.name; （p.name==p.__proto__.name）

Child.prototype.age=p.age;

var c=new Child();

console.log(c.name);

console.log(c.age);

c可以访问p的成员属性

② 替换原型（也叫组合继承常用方法）

function Parent(name, age) {

this.name = name;

this.age = age;

}

function Child() {

}

var p = new Parent('小红', 19);

Child.prototype = p;

var c = new Child();

console.log(c.name);

console.log(c.age);

③混入式（最常用唉）：将要被继承的对象成员拷贝一份，添加到继承对象

var grandpa = {

color: '#fff

'};

var parent = {

name: '小绿', age: 20

};

var child = {

gender: '女'

};

混入式：

for(var i in parent){

child[i] = parent[i];

}

for(var i in grandpa){

child[i] = grandpa[i];

}

console.log(child.grand);

child继承了 grandpa parent 这两个对象的成员属性

下边不会封装要知道上边的！！

上边代码有点冗余，可以封装：

var grandpa = {color: '#fff'};

var parent = {name: '小绿', age: 20};

var child = {gender: '女'};

child.extend = function() {

var k, // 枚举对象属性

i = 0,

obj; // 缓存当前arguments的实参对象

// 遍历arguments中的所有实参

for(; i < arguments.length; i++){

obj = arguments[i];

// 枚举当前遍历到的实参对象属性

for(k in obj){

// 将属性添加到this上

this[k] = obj[k];

}

};

child.extend(grandpa, paredt);

④ 对象冒充的方法：

function parent(name, age, sex) {

this.name = name;

this.age = age;

this.sex = sex;

}

function Child(name, age, sex, phone, address) {

this.add = parent;

this.add(name, age, sex); //调用

delete this.add; //清除内存

this.phone = phone;

this.address = address;

}

var c = new Child('小白', 18, '男', '1381235221', '北京')

console.log(c);

了解就行

es5 新增的方法 object.creat('继承的父级元素' , '给child新添加的属性')：实现原型链的继承；

var parent = {name: 'tom'};

var child = Object.create(parent, {age :{

value: 18,

writable: false,

configurable: true

}});

转载于:https://www.cnblogs.com/2016-zy-3258/p/7055780.html

js 中继承常用的几种方法相关推荐

JS实现深拷贝常用的几种方法
JS实现深拷贝常用的几种方法 <!DOCTYPE html> <html lang="en"> <head><meta charset=& ...
【javascript基础——系列10】js中隐藏元素的几种方法以及代码
系列文章 [javascript基础--系列1]前端页面ajax连接后台服务器传输数据 [javascript基础--系列2]前端页面axios连接后台服务器传输数据 [javascript基础--系 ...
js中遍历对象的几种方法
一.前言我们知道,在js的对象中,有下面几种属性: 可枚举属性不可枚举属性从原型链上继承的属性以Symbol作为key值今天,我们就来谈一谈如何遍历这些属性. 二.遍历可枚举属性首先, ...
js判断数据类型常用的6种方法
js判断数据类型常用的方法,不论在开发中开始在面试中,都是经常遇到的问题,尤其是在面试时,当面试官问及js判断数据类型的方法时,回答的越多,说明掌握的广度跟深度越多,感觉自己逼格也越高.废话不多说了, ...
Js中数组去重的几种方法
前几天在看前端面试题的时候,其中js部分有个问题是实现数组去重的算法,一开始就想了一两种方法,后来仔细回忆了下这个题,觉得该问题实现方法确实不止局限于一两种方法 ,从不同的角度去看待该问题就会有多种实 ...
Js中访问对象的两种方法
我们通常都使用点" . '"表示法来访问对象,在js中也可以用方括号" [ ] "来访问对象的属性. 使用[]时,应该将想要访问的属性用字符串的形式放在&quo ...
js中实现深拷贝的4种方法
js中深拷贝的方法原生js中递归函数拷贝将数据中所有的数据拷贝下来,对拷贝之后的数据进行修改不会影响到原数据 ,两个对象或数组不共享一块内存 <script>let obj={abc: ...
html数据类型判断,JS中判断数据类型的几种方法
1⃣️首先我们来了解一下js中的数据类型 1.基本数据类型:Undefined.Null.Boolean.Number.String(值类型) 2.复杂数据类型:Object(引用类型) (值类型和引 ...
js判断数据类型常用的四种方法
首先说一下js中的数据类型基本数据类型:String.Number.Boolean.null.undefined.Symbol 引用数据类型:Object 1.typeof const a1 = ...

js 中继承常用的几种方法

js 中继承常用的几种方法相关推荐

最新文章

热门文章