分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 网页技术

JS类对象实现继续的几种方式

发布时间:2023-09-06 01:42责任编辑:熊小新关键词:暂无标签

0. ES6可以直接使用class,extends来继承.

1.  原型继承

 1 ???????2 父类: 3 ?4 ??????function Persion(name,age){ ???5 ????????this.name = name; ???6 ????????this.age = age; ???7 ???????} ?8 ??9 ???????// 父类的原型对象属性 ??10 ???????Persion.prototype.id = 10; ?11 12 13 ???????// 子类 ??14 ???????function Boy(sex){ ??15 ????????this.sex = sex; ?16 ???????} ?17 ???????// 继承实现 ??18 ???????Boy.prototype = new Persion(‘Yuri‘,30); ?//要初始化父类不优雅~19 ???????var b = new Boy(); ?20 ?21 ????????alert(b.name)// Yuri ??22 ????????alert(b.id)//10 ?

//这种原型继承的特点:既继承了父类的模板,又继承了父类的原型对象。缺点就是父类实例传参,不是子类实例化传参,不符合常规语言的写法。

2、类继承(借用构造函数的方式继承)

// ?父类 ??function Persion(name,age){ ??????this.name = name; ??????this.age = age; ??} ?// 父类的原型对象属性 ??Persion.prototype.id = 10; ?// 子类 ??function Boy(name,age,sex){ ??????//call apply 实现继承 ?????Persion.call(this,name,age); ?????this.sex = sex; ?} ?

//Boy.prototype = new Persion(); //这个打开那个原型链对象就可以继承了. var b = new Boy(‘Yuri‘,30,‘男‘); ???alert(b.name) ?// ?Yuri alert(b.id)//undinfind 父类的原型对象并没有继承

//这种原型继承的特点:继承了父类的模板,不继承了父类的原型对象。优点是方便了子类实例传参,缺点就是不继承了父类的原型对象

3. 极简主义

//定义父类var Person = {    createNew: function(){      var person = {}; ????????????????person.name=‘Yuri‘;      person.sleep = function(){ alert("睡懒觉"); };      return person;//返返回这个对象    }};//子类var SuperPerson={ ?????????createNew:function(){ ????????????var private; //还可以定义私有属性. ????????????var ?superperson=Person.createNew(); ????????????//superperson就要以使用父类的方法和属性了. ???????????//同时增加自己的属性 ????????????superperson.fly=function(){} ????????????superperson.power=""; ????????????return superperson; ?????}} ?????var test=SuperPerson.createNew();//使用子类的createNew就可以实现继承了.console.log(test.fly, test.name, test.power) ??

没有使用任何的prototype,apply,call

JS类对象实现继续的几种方式

原文地址:https://www.cnblogs.com/yuri2016/p/8443414.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved