第一种:通过prototype来实现

prototype.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        function Person(){}

        Person.prototype.username = "lisi";
        Person.prototype.gender = "man";
        Person.prototype.fav = ["read","eat"];

        var p1 = new Person();
        var p2 = new Person();
        p2.username = "zhangsan";
        //p2.fav.push("run");
        var fav = p2.fav;
        console.log(fav)
        p2.fav = new Array();
        p2.fav = p2.fav.concat(fav);

        p2.fav.push("run");

        /*console.log(p1.username);
         console.log(p1.fav);
         console.log(p2.username);
         console.log(p2.fav);*/

        function User(){}
        User.prototype = new Person();
        User.prototype.password = "123123";
        User.prototype.email = "admin@admin.com";

        User.prototype.say = function(){
            console.log(this);
        };

        var u = new User();
        u.gretting="Hello";
        var u1 = new User();

        console.log(u.username)
        u.say();
        u1.say();

    </script>
</head>
<body>

</body>
</html>

第二种方法:通过this关键字来实现;js中的this始终指向调用它的对象
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        function Person(name,gender){
            this.name = name;
            this.gender = gender;
        }

        function User(name,gender,email,password){
            this.super = Person;
            this.super(name,gender);
            delete this.super;
            this.email = email;
            this.password = password;
            //this.Person(name,gender);
        }

        var p1 = new Person("lisi","man");

        var u = new User("zhangsan","msn","zhnagsan@zhangsan.com","123123123");
        console.log(p1.name);
        console.log(u.name);
        //var p2 = new Person();
        //p2.name = "lisi";
        //p2.gender = "man";
    </script>
</head>
<body>

</body>
</html>

第三种方法:通过call或者apply来实现
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        function Person(name,gender){
            this.name = name;
            this.gender = gender;
        }

        function User(name,gender,email){

            //对象冒充  动态改变 函数的执行上下文
            //Person.call(this,name,gender);
            Person.apply(this,[name,gender]);

            this.email = email;

            this.say = function(msg){
                console.log(this);
                console.log(msg);
            }
        }

        var u = new User("lisi","man","lisi@lisi.com");
        console.log(u.gender);
        u.say("Hello");

        u.say.call(new Person("",""),"Hello1");
        u.say.apply(window,["lisi"]);

        console.log("--------------------")
        var name = "lisi";
        var obj = {
            name:"zhangsan",
            say:function(){
                console.log(this.name);
                return function(){
                    console.log(this.name);
                    return function(){
                        console.log(this.name);
                        return {
                            name:"wangwu",
                            say:function(){
                                console.log(this.name);
                            }

                        }
                    }
                }
            }
        };

        obj.say().call(obj)().say.apply(this);

        //obj.say()();
    </script>
</head>
<body>

</body>
</html>

JS中的继承实现方式的更多相关文章

  1. JS中写继承的方式

    有父子两个函数,代表两个类: var parent = function(){} var child = function(){} 一.直接继承 child.prototype = new paren ...

  2. js中实现继承的几种方式

    首先我们了解,js中的继承是主要是由原型链实现的.那么什么是原型链呢? 由于每个实例中都有一个指向原型对象的指针,如果一个对象的原型对象,是另一个构造函数的实例,这个对象的原型对象就会指向另一个对象的 ...

  3. Javascript中实现继承的方式

    js中实现继承和传统的面向对象语言中有所不同:传统的面向对象语言的继承由类来实现,而在js中,是通过构造原型来实现的,原型与如下几个术语有关: ①构造函数:在构造函数内部拥有一个prototype属性 ...

  4. 【学习笔记】六：面向对象的程序设计——理解JS中的对象属性、创建对象、JS中的继承

    ES中没有类的概念,这也使其对象和其他语言中的对象有所不同,ES中定义对象为:“无序属性的集合,其属性包含基本值.对象或者函数”.现在常用的创建单个对象的方法为对象字面量形式.在常见多个对象时,使用工 ...

  5. JS中的继承(上)

    JS中的继承(上) 学过java或者c#之类语言的同学,应该会对js的继承感到很困惑--不要问我怎么知道的,js的继承主要是基于原型(prototype)的,对js的原型感兴趣的同学,可以了解一下我之 ...

  6. js中的继承和重载

      js中有三种继承方式:一.通过原型(prototype)实现继承 二.借用构造函数式继承,可分为通过call()方法实现继承和通过apply()方法实现继承 仅仅通过原型继承我们可以发现在实例化子 ...

  7. html css <input> javaScript .数据类型 JS中的函数编写方式 BOM总结 DOM总结

    Day27  html css div 块标签. 特点: 独占一行,有高度和宽度 span 行元素. 特点:在同一行显示,当前行满了自动去下一行显示. 不识别高度和宽度 1.1.1.1 2.输入域标签 ...

  8. 基础篇：1.JavaScript运行在html中，引用有几种方式？—— 6.js中常用的输出方式？

    书接上文,上文提到若干条JavaScript的基础性知识,大部分都是一些概念性的东西,本着认真严谨的态度,我们要认真对待,有些条目的问题是某个知识点的周边延伸,为节约篇幅,就一起整理了,如有描述不对的 ...

  9. JS中的继承(下)

    JS中的继承(下) 在上一篇 JS中的继承(上) 我们介绍了3种比较常用的js继承方法,如果你没看过,那么建议你先看一下,因为接下来要写的内容, 是建立在此基础上的.另外本文作为我个人的读书笔记,才疏 ...

随机推荐

  1. Dynamics CRM 2011 报表无法显示的问题总结

    一.一般打开报表会出现:该报表无法显示.(reProcessingAborted)和由于运行Microsoft SQL Server Reporting Services 的服务器上没有安装 Micr ...

  2. RK3288 wifi模块打开或关闭5G信号

    CPU:RK3288 系统:Android 5.1 如果硬件使用的wifi模块支持5G,则系统设置中打开wifi,除了会搜索到普通的2.4G信号,还会搜索到xxx_5G信号. 如果路由器开了5G信号, ...

  3. javacv 340使用 人脸检测例子【转载】

    Java下使用opencv进行人脸检测 工作需要,研究下人脸识别,发现opencv比较常用,尽管能检测人脸,但识别率不高,多数是用来获取摄像头的视频流的,提取里面的视频帧,实现人脸识别时通常会和其他框 ...

  4. webSocket支持的浏览器

  5. Android免费短信验证

    转载请注明住处:http://blog.csdn.net/crazy1235/article/details/41912003 介绍 短信验证功能大家都很熟悉了.在很多地方都能见到,注册新用户或者短息 ...

  6. 【Spring学习笔记-MVC-10】Spring MVC之数据校验

    作者:ssslinppp       1.准备 这里我们采用Hibernate-validator来进行验证,Hibernate-validator实现了JSR-303验证框架支持注解风格的验证.首先 ...

  7. 小峰mybatis（5）mybatis使用注解配置sql映射器--动态sql

    一.使用注解配置映射器 动态sql: 用的并不是很多,了解下: Student.java 实体bean: package com.cy.model; public class Student{ pri ...

  8. AspectJ入门

    AOP的实现方式有两种: AOP框架在编译阶段,就对目标类进行修改,得到的class文件已经是被修改过的.生成静态的AOP代理类(生成*.class文件已经被改掉了,需要使用特定的编译器).以Aspe ...

  9. redis sentinel无法启动问题

    redis sentinel 正常启动 ./redis-sentinel sentinel.conf 就可以启动, 但是如果linux 操作系统(比如阿里云os)不支持ipv6,就会导致sentine ...

  10. 终端直接执行py文件，不需要python命令

    然后给脚本文件运行权限,方法(1)chmod +x ./*.py方法(2)chmod 755 ./*.py (777也无所谓啦) 这个命令不去调整,会出现permission denied的错误终端直 ...