zoukankan      html  css  js  c++  java
  • js对象实例化的常见三种方式

    三种常见模式:工厂模式,构造函数模式,原型模式

    <span style="font-size:18px;"><!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Object</title>
    </head>
    <body>
    <h1>创建对象常见的三种方式</h1>
    </body>
    <script>
        window.onload=function(){
            //工厂模式
            function oj(){
                var lio=new Object();
                lio.name='lio';
                lio.attr='男';
                lio.hobby=function(){
                    var li=document.createElement("p");
                    var txt=document.createTextNode("三妹");
                    li.appendChild(txt);
                    document.body.appendChild(li);
                };
                return lio;
            }
            var person=oj();
            //alert(person.name);
    
            //构造函数模式
            function oj2(name,age){
                this.name=name;
                this.age=age;
                this.hobby=function(){
                    var li=document.createElement("p");
                    var txt=document.createTextNode("三妹");
                    li.appendChild(txt);
                    document.body.appendChild(li);
                }
            }
            var person2=new oj2('三妹',123);
            person2.hobby();
            alert(person2.name);
    
            //原型模式
            function oj3(){
                //this.name='lio';
            }
            oj3.prototype.name='lio';
            oj3.prototype.love= function (name) {
                alert("爱"+name);
            };
            var person3=new oj3();
            //检測是在实例中还是在原型中
            alert(person3.hasOwnProperty("name"));
            alert(person3.hasOwnProperty("rename"));
            person3.love('三妹');
    
            //混合模式
            function oj4(age) {
                this.age=age;
                this.rename='aaaa';
            };
            oj4.prototype={
                constructor:oj4,
                name:'lio',
                age:123,
                love: function (name) {
                    alert(name+"爱三妹");
                }
            };
            var person4=new oj4(18);
            alert(person4.hasOwnProperty("age"));//true
            person4.love('lio');
    
        }
    </script>
    </html></span>


  • 相关阅读:
    作业7-英文词频统计预备,组合数据类型练习
    作业6-凯撒编码、GDP格式化输出、九九乘法表
    作业5-字符串操作
    作业3-turtle库基础练习
    作业2-Python基础练习
    理解管理信息系统
    Git-git rebase详解
    C语言中基本的数据类型
    读取配置文件的C语言接口实现
    Linux之异步IO机制分析
  • 原文地址:https://www.cnblogs.com/lxjshuju/p/6941410.html
Copyright © 2011-2022 走看看