前  言

 OOP 

 JavaScript中OOP——>>>面向对象中的继承/闭包

1.1面向对象的概念


  使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方法。
      >>> 继承的两方,发生在两个类之间。

1.2JS模拟实现继承的三种方式:

首先,了解一下call/apply/binb:通过函数名调用方法,强行将函数中的this指向某个对象;
            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);
① eg:
 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)(””,””,””);
                    }
② eg:
 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(””,””,””);
③ eg:
 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——面向对象中的继承/闭包相关推荐

  1. Day 8 python OOP面向对象中

    OOP面向对象中 析构方法 __ del __()--当对象被删除或销毁时,解释器默认调用的方法 class Animal:def __init__(self, name): # 自动执行self.n ...

  2. 前端 JavaScript 设计模式前奏--面向对象-封装、继承、多态

    JavaScript 面向对象 如图所示: 1. 什么是面向对象 1. 面向对象的概念 2. 面向对象的三要素: 继承/封装/多态 ⭐️ 3. JS 的应用举例 4. 面相对象的意义 --- 数据结构 ...

  3. PHP中oop面向对象基础知识(一)

                                                                                        OOP 基础知识汇总(一) &g ...

  4. JavaScript(JS) 面向对象(封装、继承、多态)

    面向对象是把事物给对象化,包括其属性和行为.面向对象编程更贴近实际生活的思想.可以简单的理解面向对象的底层还是面向过程,面向过程抽象成类,然后封装,方便使用就是面向对象.本文主要介绍JavaScrip ...

  5. javascript(面向对象,作用域,闭包,设计模式等)

    javascript(面向对象,作用域,闭包,设计模式等) 1. 常用js类定义的方法有哪些? 参考答案:主要有构造函数原型和对象创建两种方法.原型法是通用老方法,对象创建是ES5推荐使用的方法.目前 ...

  6. 如何理解并学习javascript中的面向对象(OOP)

    本文不适合javascript初学者看(javascript水平还停留在函数级别的朋友,看了会觉得很晕的).如果你想让你的javascript代码变得更加优美,性能更加卓越.或者,你想像jQuery的 ...

  7. javascript 中面向对象实现 如何继承

    上一篇博客已经说了关于javascript中的封装, 其中也说了javascript中本来是没有类的,我们上一篇的封装也是用javascript中的函数去模拟一个类,最后我们还模拟了一个构造函数.那 ...

  8. html5学习笔记---05.JavaScript 中的面向对象,继承和封装

    05.JavaScript 中的面向对象 a.创梦技术qq交流群:CreDream:251572072 a.JavaScript 是一种基于对象的语言   类:JavaScript 对象很抽象,所以下 ...

  9. 简析面向对象中的继承,原型链,闭包之继承

    为什么80%的码农都做不了架构师?>>>    我们理解的继承简单来说就是拿来主义:自己没有,别人有,把别人的拿过来使用或者让其成为自己的.那么如何实现继承呢? 一,混入继承 由于一 ...

最新文章

  1. 【烦人的问题】有一天发现VSCode中自己的鼠标选择老是跨行选择多段代码,怎么都改不回来,而且用alt+shift+鼠标都无法切换,肿么办?
  2. Qt之JSON生成与解析
  3. python数字类型-Python基础:数据类型-数字(5)
  4. 【java读书笔记】——java的异常处理
  5. 日志挖掘(logminer)
  6. Spring Boot的快速入门
  7. bzoj3594 [Scoi2014]方伯伯的玉米田
  8. tornado 重定向404
  9. Url传值的Get method and Post method
  10. BOOST库介绍(四)——文件系统相关
  11. 电子游戏理论基础初探
  12. VNPY3.0 量化交易软件开源代码-探索更真实的量化交易世界,
  13. dos命令行的四种打开方式
  14. 3万字细说数据仓库体系(建议收藏)
  15. 材料研究生转行做什么?
  16. 【python与数据分析】Matplotlib数据可视化
  17. 千万不要看—思路火花
  18. ajax入门学习(一)
  19. 基于C#分步式聊天系统的在线视频直播系统设计
  20. 鸿蒙系统控制LED的实现方法之经典

热门文章

  1. hal库开启中断关中断_stm32的HAL库开发学习笔记之外部中断
  2. git2.29.2.2怎么安装_MySQL5.5怎么安装
  3. HMM——前向算法与后向算法
  4. 值得关注的医疗 AI 公司(待续)
  5. memcpy函数的实现
  6. DDG全家桶之3022
  7. 一个好用的浏览器暗色浏览插件 Dark Reader
  8. (转)C# WebApi 身份认证解决方案:Basic基础认证
  9. ubantu之Git使用
  10. 安装Cornerstone3.1注意点