交流群:462197261站长百科站长论坛热门标签收藏本站北冥有鱼 互联网前沿资源第一站 助力全行业互联网+
点击这里给我发消息
  • 当前位置:
  • JS函数进阶之继承用法实例分析

    北冥有鱼 教程大全 2020-01-15 ,,

    本文实例讲述了JS函数进阶之继承用法。分享给大家供大家参考,具体如下:

    直接代码,不解释:

    <html>
        <head>
            <title>js函数继承进阶</title>
            <meta charset="UTF-8"/>
            <script type="text/javascript">
                function person(name,age){  //对象的创建
                    this.name=name;
                    this.age=age;
    //                this.test=function(a){
    //                    console.log("能运行吗");
    //                }
                }
                function book(name){
                    this.name="是我吗";
                    this.lookat=function(a){
                        console.log("看看能行吗");
                    }
                }
                function czxt(name){
                    this.name=name;
                }
                person.prototype.read=function(a){console.log("I can read");};
                book.prototype.sign=function(a){console.log("I am book"); return new book()};    //视其为一个对象的一个属性进行”继承“
                person.prototype.book=new book();               //直接进行“包含”
    //            person.prototype=new book();
                czxt.prototype.appear=function(a){console.log("我是操作系统")};
                book.prototype.subject=new czxt();
    //            book.prototype=new czxt();
                var p1=new person("张三",37);
    //            p1.lookat();    //类内部的方法也可以调用
    //            console.log(p1.name);   //包含类和父类都含有,是父类的name属性值。  "张三"
                console.log(p1.book.name); //用属性进行调用的话,是包含类的name属性   ”是我吗“
    //            p1.sign();     //直接调用包含函数方法
    //            p1.book.sign();   //调用对象属性包含的方法
    //            p1.read();     //调用公共对象外函数
    //            p1.test();    //函数调用函数内部的函数(视函数为对象)
    //            p1.address="山东"; //每个特定对象主动添加对象属性
    //            console.log(p1.address);
                var b1=new book();
    //            b1.appear();   //调用其继承体内的函数
    //            p1.appear();   //无法调用包含对象内的包含方法(无法直接调用孙子函数)
    //            p1.book.appear();  //用属性调用也不行啊,不是函数可还行
    //            p1.book.subject.appear(); //双重属性定义可以,牛逼了。
    //            p1.sign().appear();  //person非属性调用book,在book的sign方法中添加一个book类型的返回值以此来调用book包含的方法。
            </script>
        </head>
        <body>
            <h3>js函数继承进阶</h3>
        </body>
    </html>
    
    

    运行结果:

    进一步理解,引入prototype,一方面是实现了同一个类创建对象时创建实现相同功能的方法,这些方法在对象创建时同样会占用内存,所以我们把方法定义到外面变成公共的方法,节省了内存(注:如果是类内部的方法构建两个对象时其内部的函数时不同的,不相等且不等同)另一方面,降低了代码的冗余,其中当你把一个类的prototype值设置为一个对象,那么你就拥有了其内部的属性和方法,当进行包含后可以直接利用带属性调用或者直接调用,这样有一个好处是:我们没有必要创建这个对象就可以直接调用其内部的方法。但是对于三层的包含关系,我们不能使用,要想使用就只能用连续双重的属性调用。对于内部属性值如果子类和父类的属性名相同,那么直接调用就是父类的属性,利用属性调用包含类可以调用子类的属性。

    感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。

    更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

    希望本文所述对大家JavaScript程序设计有所帮助。


    广而告之:
    热门推荐:
    Linux下MySQL 5.5.8 源码编译安装记录分享

    系统:Ubuntu 10.10 mysql源码文件:mysql-5.5.8.tar.gz 安装所需工具:cmake, GNU make, gcc, Perl, libncurses5-dev, bison(可选), chkconfig 注: 1.官方2010-11-18的源码有几处bug,在编译之前参照官方的说明,进行了手动修改。 官方说明链接:http://lists.mysql.c···

    怎样实现H5+CSS3手指滑动切换图片的示例代码

    包含3个文件:html、slider-H5.js、jquery.js。在html中可配置滑动参数。具体代码如下: HTML代码: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible"···

    Asp.net中使用Sqlite数据库的方法

    实际运用中当我用SqliteAdmin以及SQLite Expert Professional 2软件新建Sqlite数据库的时候在ASP.NET中是无法运用的,老是报错:文件不是一个合法的数据库。后来采用一种方法,就是直接在ASP.NET里面利用引用入的DLL新建数据库就可以用了。 string datasource = "d:\\te···

    修改MYSQL密码的几种常用方法总结

    首先要声明一点,大部分情况下,修改MySQL是需要有mysql里的root权限的, ­所以一般用户无法更改密码,除非请求管理员。 ­­方法一 ­使用phpmyadmin,这是最简单的了,修改mysql库的user表, ­不过别忘了使用PASSWORD函数。 ­­方法二 ­使···

    Vue 实现前进刷新后退不刷新的效果

    需求一: 在一个列表页中,第一次进入的时候,请求获取数据。 点击某个列表项,跳到详情页,再从详情页后退回到列表页时,不刷新。 也就是说从其他页面进到列表页,需要刷新获取数据,从详情页返回到列表页时不要刷新。 解决方案在 app.vue 设置: <keep-alive include="list···

    Linux系统下PHP-FPM的安装和配置教程

    基本安装方法 安装工具包 $ sudo apt-get install python-software-properties 添加ppa源 $ sudo add-apt-repository ppa:yola/php5 安装php5-fpm sudo apt-get update sudo apt-get install php5-fpm 其它必要的软件安装接 sudo apt-get instal···

    在IE中调用javascript打开Excel的代码(downmoon原作)

    复制代码 代码如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  <HTML>  <HEAD>  <META http-equiv=Content-Type content="text/html; charset=utf-8">&nbs···

    jQuery对table表格进行增删改查

    最近要处理一些前端的工作,重新学习了一下jQuery,感觉还是那么的锋利啊!!! 总结了一下对table的增删改查,写一篇留着以后自己recode。 1.首先我自己写了一个简单的div布局。 2.实现几个用<a>标签做的按钮的功能 分别是新增 修改 删除 查询和返回。 代码如下 html+···

    【网站策划书】网站建设前如何撰写网站规划?

    做网站之前,你需要有一个网站的总体规划,这是网站规划书。网站策划文件是网站策划人员在网站建设初期,通过对客户不同情况的市场分析,对网站建设和运营进行有计划的指导和阶段性总结,形成的书面报告。一、网站建议书包括以下内容:网站建设前市场分析(企业自行处理)(1···

    微信小程序-form表单提交代码实例

    效果 html代码 <form bindsubmit="formSubmit" bindreset="formReset"> <view class="section section_gap"> <view class="section__title">是否公开信息</view> <switch name="isPub" /> </view> <view class="section">···