JavaScript中OOP——面向对象中的继承/闭包
前 言
OOP
JavaScript中OOP——>>>面向对象中的继承/闭包
1.1面向对象的概念
使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方法。
>>> 继承的两方,发生在两个类之间。
1.2JS模拟实现继承的三种方式:
call写法: func.call(func的this指向的obj,参数1,参数2...);
apply写法: func.apply(func的this指向的obj,[参数1,参数2...]);
binb写法: func.binb(func的this指向的obj)(参数1,参数2...);
call与apply的唯一区别:在于接收func函数的参数方式不同。call采用直接写多个参数的方式,而apply采用是一个数组封装所有参数。
① 扩展Object实现继承
1:定义父类
function Parent(){}
2:定义子类
funtion Son(){}
3:通过原型给Object对象添加一个扩展方法。
Object.prototype.customExtend = function(parObj){
for(var i in parObj){
// 通过for-in循环,把父类的所有属性方法,赋值给自己
this[i] = parObj[i];
}
}
4:子类对象调用扩展方法
Son.customExtend(Parent);
1 // 1.定义父类 2 function Person(name,age){ 3 this.name = name; 4 this.age = age; 5 this.say = function(){ 6 alert(this.name+":"+this.age); 7 } 8 } 9 // 2.定义子类 10 function Student(no){ 11 this.no = no; 12 this.add = function(a,b){ 13 alert(a+b); 14 } 15 } 16 function Programmer(lang){ 17 this.lang = lang; 18 this.codding = function(){ 19 alert("我爱敲代码!敲代码使我快乐!"); 20 } 21 } 22 // 3.通过原型给Object对象添加一个扩展方法。 23 Object.prototype.customExtend = function(parObj){ 24 for(var i in parObj){ 25 // 通过for-in循环,把父类的所有属性方法,赋值给自己 26 this[i] = parObj[i]; 27 } 28 } 29 30 var p = new Person("小明","18"); 31 var s = new Student("0001"); 32 s.customExtend(p);//现在s继承了p的所有属性和方法。 33 console.log(s) 34 35 var pro = new Programmer("JavaScript"); 36 pro.customExtend(p); 37 console.log(pro) 38 39 40 41
② 使用call/apply/binb.
1:定义父类
funtion Parent(””,””,””){}
2:定义子类
function Son(””,””,””){}
3:在子类中通过call方法/apply/binb方法去调用父类。
function Son(){
Parent.call(this,””,””,””);// Parent.apply(this,[””,””,””]);//Parent.binb(this)(””,””,””);
}
1 function Person(name,age){ 2 this.name = name; 3 this.age = age; 4 this.say = function(){ 5 alert("我叫:"+this.name+";今年:"+this.age+"岁"); 6 } 7 } 8 9 /** 文档注释,调用函数时,可以看到注释内容。 10 * 11 * no:学员编号 12 * stuName:学员姓名 13 * stuAge:学员年龄 14 */ 15 function Student(no,stuName,stuAge){ 16 17 this.no = no; 18 Person.call(this,stuName,stuAge); 19 // 执行上述代码,相当于将下面的代码执行一遍。并且把原来Person类的this直接替换为Stundet的this(当实例化Student时的那个对象) 20 21 // this.name = "张三"; 22 // this.age = 14; 23 // this.say = function(){ 24 // alert("我叫:"+this.name+";今年:"+this.age+"岁"); 25 // } 26 } 27 28 var stu = new Student(12,"zhangsan",14); 29 stu.say(); 30 31 console.log(stu) 32 33 //Person("zhangsan","123");
③ 使用原型继承
1:定义父类
function Parent(””,””,””){}
2:定义子类
function Son(””,””,””){}
3:把在子类对象的原型对象声明为父类的实例。
Son.prototype = new Parent(””,””,””);
1 function Person(name,age){ 2 this.name = name; 3 this.age = age; 4 this.say = function(){ 5 alert("我叫:"+this.name+";今年:"+this.age+"岁"); 6 } 7 } 8 9 /** 文档注释,调用函数时,可以看到注释内容。 10 * 11 * no:学员编号 12 * stuName:学员姓名 13 * stuAge:学员年龄 14 */ 15 function Student(no){ 16 this.no = no; 17 } 18 19 Student.prototype = new Person("张三",14) 20 21 var stu = new Student(12); 22 23 stu.say(); 24 25 console.log(stu) 26 27 //Person("zhangsan","123");
1.3面向对象中的闭包
1、 全局变量:函数外声明的变量
局部变量:函数内声明的变量
在JS中,函数为唯一的局部作用域,而if、for等其他{}没有自己的作用域
所以,函数外不能访问局部变量。其实,变量在函数执行完毕以后,占用的内存就被释放。
2、如何访问函数私有变量?
JS中,提供了一种"闭包"的概念:在函数内部,定义一个子函数,可以用子函数访问父函数的私有变量。执行完操作以后,将子函数通过return返回。
function func2(){
var num = 1;
function func3(){
var sum = num+10;
alert(sum);
}
return func3;
}
var f = func2();
f();
3、闭包的作用:
① 访问函数的私有变量;
② 让函数的变量始终存在于内存中,而不被释放。
转载于:https://www.cnblogs.com/zhuanzhibukaixin/p/6849230.html
JavaScript中OOP——面向对象中的继承/闭包相关推荐
- Day 8 python OOP面向对象中
OOP面向对象中 析构方法 __ del __()--当对象被删除或销毁时,解释器默认调用的方法 class Animal:def __init__(self, name): # 自动执行self.n ...
- 前端 JavaScript 设计模式前奏--面向对象-封装、继承、多态
JavaScript 面向对象 如图所示: 1. 什么是面向对象 1. 面向对象的概念 2. 面向对象的三要素: 继承/封装/多态 ⭐️ 3. JS 的应用举例 4. 面相对象的意义 --- 数据结构 ...
- PHP中oop面向对象基础知识(一)
OOP 基础知识汇总(一) &g ...
- JavaScript(JS) 面向对象(封装、继承、多态)
面向对象是把事物给对象化,包括其属性和行为.面向对象编程更贴近实际生活的思想.可以简单的理解面向对象的底层还是面向过程,面向过程抽象成类,然后封装,方便使用就是面向对象.本文主要介绍JavaScrip ...
- javascript(面向对象,作用域,闭包,设计模式等)
javascript(面向对象,作用域,闭包,设计模式等) 1. 常用js类定义的方法有哪些? 参考答案:主要有构造函数原型和对象创建两种方法.原型法是通用老方法,对象创建是ES5推荐使用的方法.目前 ...
- 如何理解并学习javascript中的面向对象(OOP)
本文不适合javascript初学者看(javascript水平还停留在函数级别的朋友,看了会觉得很晕的).如果你想让你的javascript代码变得更加优美,性能更加卓越.或者,你想像jQuery的 ...
- javascript 中面向对象实现 如何继承
上一篇博客已经说了关于javascript中的封装, 其中也说了javascript中本来是没有类的,我们上一篇的封装也是用javascript中的函数去模拟一个类,最后我们还模拟了一个构造函数.那 ...
- html5学习笔记---05.JavaScript 中的面向对象,继承和封装
05.JavaScript 中的面向对象 a.创梦技术qq交流群:CreDream:251572072 a.JavaScript 是一种基于对象的语言 类:JavaScript 对象很抽象,所以下 ...
- 简析面向对象中的继承,原型链,闭包之继承
为什么80%的码农都做不了架构师?>>> 我们理解的继承简单来说就是拿来主义:自己没有,别人有,把别人的拿过来使用或者让其成为自己的.那么如何实现继承呢? 一,混入继承 由于一 ...
最新文章
- 【烦人的问题】有一天发现VSCode中自己的鼠标选择老是跨行选择多段代码,怎么都改不回来,而且用alt+shift+鼠标都无法切换,肿么办?
- Qt之JSON生成与解析
- python数字类型-Python基础:数据类型-数字(5)
- 【java读书笔记】——java的异常处理
- 日志挖掘(logminer)
- Spring Boot的快速入门
- bzoj3594 [Scoi2014]方伯伯的玉米田
- tornado 重定向404
- Url传值的Get method and Post method
- BOOST库介绍(四)——文件系统相关
- 电子游戏理论基础初探
- VNPY3.0 量化交易软件开源代码-探索更真实的量化交易世界,
- dos命令行的四种打开方式
- 3万字细说数据仓库体系(建议收藏)
- 材料研究生转行做什么?
- 【python与数据分析】Matplotlib数据可视化
- 千万不要看—思路火花
- ajax入门学习(一)
- 基于C#分步式聊天系统的在线视频直播系统设计
- 鸿蒙系统控制LED的实现方法之经典