`
好好学习-天天向上
  • 浏览: 34445 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

js 面向对象继承的两种方式及封装

 
阅读更多

 

        最近学习js面向对象,一直不理解继承及封装,通过查看文字资料及视频资料,现总结如下。

   

    第一种方式:通过 prototype:student.prototype = new Person();

function Person(name){
    this.name = name;
}
Person.prototype.say = function(){
    alert("per_hello" + this.name);
}
function student(){
    this.name = name;
}
student.prototype = new Person();
var supersay = student.prototype.say;
student.prototype.say = function(){
    supersay.call(this);
    alert("stu_hello" + this.name);
}
var s = new student();
s.say();

    

   第二种方式:通过直接赋值:  var _this = Person(name);

function Person(name){
        var n = "ding";
        var _ren = {};
        _ren.name = name;
        _ren.sayhello = function(){
            alert("P_hello" + _ren.name + n );
        }
        return _ren;
    }
function Teacher(){
    var _this = Person(name);
    var supersay = _this.sayhello;
    _this.sayhello = function(){
        supersay.call(_this);
        alert("T_hello" + _this.name);
    }
    return _this;
}
var t = Teacher("imi");
t.sayhello();

 

 

 

    这一部分是封装。

(function(){
    function Person(name){
        var n = "ding";
        var _ren = {};
        _ren.name = name;
        _ren.sayhello = function(){
            alert("P_hello" + _ren.name + n );
        }
        return _ren;
    }
    window.Person = Person;
}());
function Teacher(){
    var _this = Person(name);
    var supersay = _this.sayhello;
    _this.sayhello = function(){
        supersay.call(_this);
        alert("T_hello" + _this.name);
    }
    return _this;
}
var t = Teacher("imi");
t.sayhello();

    封装其实 就是用()将function放里面,然后最后加()让它能自己执行自己,同时window.Person = Person; 让它能被调用。

     总结一下这三个,其实实现的东西都一样只是表现形式不一样,需要注意的是子类中可以定义一个和父类相同的方法,但执行结果是只执行子类的方法,即子类定义的覆盖了父类的方法。如果想调用父类的方法可以通过

  var supersay = _this.sayhello;
  supersay.call(_this);
 进行访问及调用。
    封装中即第三个,定义的
var n = "ding";
    只能在其封装函数的内部使用,即:
alert("P_hello" + _ren.name + n );
   不能在外部使用,即:
alert("T_hello" + _this.name);
不能写成alert("T_hello" + _this.name + n);
不会执行出预期效果。
 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

分享到:
评论

相关推荐

    JS继承与闭包及JS实现继承的三种方式

    我们都知道,面向对象的三大特征——封装、继承、多态。 封装无非就是属性和方法的私有化,所以我们JS中提供了私有属性和私有方法。 而JS中并没有多态,因此我们说JS是一门基于对象的语言,而非面向对象的语言。 ...

    写给大家看的面向对象编程书(第3版).[美]Matt Weisfeld(带详细书签).pdf

    书中结合代码示例生动透彻地讲述了面向对象思想的精髓,让读者真正学会以对象方式进行思考。此外,本书还讨论了各种与面向对象概念密切相关的应用主题,包括XML、UML建模语言、持久存储、分布式计算和客户/服务器...

    javascript 面向对象全新理练之数据的封装

    它是面向对象程序设计的三要素之首,其它两个是继承和多态,关于它们的内容在后面再讨论。 关于数据封装的实现,在 C++、Java、C# 等语言中是通过 public、private、static 等关键字实现的。在 JavaScript 则采用了...

    javascript 面向对象编程基础 多态

    Javascript已经可以模拟出面向对象的封装和继承特性,但是不幸的是Javascript对多态特性的支持非常弱!其它面向对象语言的多态一般都由方法重载和虚方法来实现多态,Javascript也通过这两种途径来实现! 重载:由于...

    【JavaScript核心技术卷】JS的逻辑内存模型

    文章目录JavaScript的逻辑内存模型一、面向对象的三要素二、JavaScript的逻辑内存模型三、JavaScript的对象与Java的实例四、window对象的内存逻辑模型五、Object构造函数的内存逻辑模型六、Function构造函数的内存...

    算法实践(JavaScript & Java),排序,查找、树、两指针、动态规划等.zip

    面向对象: Java是一种纯粹的面向对象编程语言,支持封装、继承和多态等面向对象的概念。这使得Java编写的代码更加模块化、可维护和可扩展。 多线程支持: Java内置了对多线程的支持,允许程序同时执行多个任务。这...

    JavaScript设计模式 (美)哈梅斯(Harmes,R), (美)迪亚斯(Diaz,D)著 源码+PDF

    第一部分给出了实现具体设计模式所需要的面向对象特性的基础知识,主要包括接口、封装和信息隐藏、继承、单体模式等内容。第二部分则专注于各种具体的设计模式及其在JavaScript语言中的应用,主要介绍了工厂模式、...

    Pro_JavaScript_Design_Patterns

    第一部分给出了实现具体设计模式所需要的面向对象特性的基础知识,主要包括接口、封装和信息隐藏、继承、单体模式等内容。第二部分则专注于各种具体的设计模式及其在JavaScript语言中的应用,主要介绍了工厂模式、...

    JavaScript设计模式:ES5 + ES6 + CoffeeScript + TypeScript设计模式,其中包含一些理论,实际示例和UML图

    以下是所有可用语言的列表: ECMAScript(香草) ES5 ES6 CoffeeScript 打字稿“四人帮”(GoF)模式基于从现实生活中汲取灵感的原始提要,有两种不同的口味:“”和“”。 经典风格模仿了Java等传统的基于类的面向...

    Java语言基础下载

    创建线程的两种方式 179 线程的控制 180 实例分析 182 内容总结 189 独立实践 190 第十二章:高级I/O流 192 学习目标 192 I/O基础知识 193 字节流 193 字符流 194 节点流 194 过程流 194 基本字符流类 198 对象串行...

    python入门到高级全栈工程师培训 第3期 附课件代码

    02 什么是异常处理及异常处理的两种方式对比 03 多分支与万能异常 04 异常处理的其他内容 05 什么时候用异常处理 06 什么是socket 07 套接字发展及分类 08 基于tcp协议的套接字编程 09 socket底层工作原理解释 10 ...

    亮剑.NET深入体验与实战精要2

    13.4.3 面向对象封装、继承、多态的应用 468 13.4.4 设计模式、条件外置及反射技术的应用 471 13.5 面向对象分析(OOA)的方法 475 13.6 面向对象设计的原则 478 13.6.1 优先使用(对象)组合,而非(类)继承 478 ...

    亮剑.NET深入体验与实战精要3

    13.4.3 面向对象封装、继承、多态的应用 468 13.4.4 设计模式、条件外置及反射技术的应用 471 13.5 面向对象分析(OOA)的方法 475 13.6 面向对象设计的原则 478 13.6.1 优先使用(对象)组合,而非(类)继承 478 ...

    庖丁解牛:纵向切入ASP.NET 3.5控件和组件开发技术

    16.2.3 类类型以及面向对象继承特征 569 16.2.4 枚举类型 570 16.2.5 反射功能 570 16.3 ajax library中的常用类型 571 16.3.1 ajax library对javascript基类型的扩展 571 16.3.2 sys.stringbuilder类 576 ...

    庖丁解牛 纵向切入ASP.NET 3.5控件和组件开发 part1

    16.2.3 类类型以及面向对象继承特征 569 16.2.4 枚举类型 570 16.2.5 反射功能 570 16.3 ajax library中的常用类型 571 16.3.1 ajax library对javascript基类型的扩展 571 16.3.2 sys.stringbuilder类 576 ...

    庖丁解牛 纵向切入ASP.NET 3.5控件和组件开发 part2

    16.2.3 类类型以及面向对象继承特征 569 16.2.4 枚举类型 570 16.2.5 反射功能 570 16.3 ajax library中的常用类型 571 16.3.1 ajax library对javascript基类型的扩展 571 16.3.2 sys.stringbuilder类 576 ...

    庖丁解牛纵向切入ASP.NET 3.5控件和组件开发技术.pdf

    16.2.3 类类型以及面向对象继承特征569 16.2.4 枚举类型570 16.2.5 反射功能570 16.3 ajax library中的常用类型571 16.3.1 ajax library对javascript基类型的扩展571 16.3.2 sys.stringbuilder类576 16.4 ajax...

Global site tag (gtag.js) - Google Analytics