三种常见模式：工厂模式，构造函数模式，原型模式

<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>



js对象实例化的常见三种方式的更多相关文章

  1. Spring学习之实例化bean的三种方式

    实例化bean的三种方式 构造器实例化bean Person.java public class Person { private String name; private Integer age; ...

  2. JS中事件绑定的三种方式

    以下是搜集的在JS中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="upl ...

  3. JS弹出对话框的三种方式

    JS弹出对话框的三种方式 我们用到了alert()方法.prompt()方法.prompt()方法,都是在网页有一个弹出框,那么就让我们探究一下他们之间的区别: 一.第一种:alert()方法 < ...

  4. Js构造对象-添加方法的三种方式

    Js构造函数添加方法有多种方案,来看一个混合方式构造函数的例子:申明person构造函数,有两个属性,name,qq.在原型上添加方法showname.这是最常用的方法. <script> ...

  5. js中点击事件方法三种方式的区别

    在javascript中,可以为某个元素指定事件,指定的方式有以下三种: 1.在html中,使用onclick属性 2.在javascript中,使用onclick属性 (1)注意函数名没有双引号. ...

  6. js弹出对话框的三种方式（转）

    原文地址:https://www.jb51.net/article/81376.htm javascript的三种对话框是通过调用window对象的三个方法alert(),confirm()和prom ...

  7. js中定义变量的三种方式const,val,let 的区别

    js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始化. 1 const b = 2;//正确 2 // const b;//错误,必须初始 ...

  8. Spring 实例化bean的三种方式

    第一种方法:直接配置Bean <bena id="所需要实例化的一个实例名称" class="包名.类名"/> 例如: 配置文件中的bean.XML ...

  9. js实现选项卡切换的三种方式

    前两种主要实现一个选项卡的切换,第三种使用闭包看书,构造函数实现多个选项卡的切换: 1.第一种实现实现效果为: 实现代码为: <!doctype html> <!DOCTYPE ht ...

随机推荐

  1. jQuery.fn.extend和jQuery.extend

    <script src="http://www.cssrain.cn/demo/JQuery+API/jquery-1[1].2.1.pack.js" type=" ...

  2. Java 基础入门随笔（4） JavaSE版——程序流程控制

    上一节对于运算符有了大致的了解,这一节针对程序流程控制进行复习!程序流程控制包括顺序结构.判断结构(if).选择结构(switch).循环结构. 1.判断结构 ①if语句的第一种格式:        ...

  3. vps 虚拟服务器 教程 ( Virtual Private Server 虚拟专用服务器 )

    VPS是虚拟服务器的意思.他是通过软件在独立服务器上划分出来的一部分资源.从而虚拟出一个服务器.他拥有独立的IP.独立的操作系统.以及用户名和密码.在功能和使用方法上与服务器一模一样.用户也可以根据自 ...

  4. codeforces_455B

    B. A Lot of Games time limit per test 1 second memory limit per test 256 megabytes input standard in ...

  5. Android Measure 体系简单总结

    Android对View的测量是半协商半强制半模糊半具体的. 测量过程中的两套尺寸体系:  [半强制] ParentView**约束ChildView: **MeasureSpec(通过measure ...

  6. Linux文件排序和FASTA文件操作

    文件排序 seq: 产生一系列的数字; man seq查看其具体使用.我们这使用seq产生下游分析所用到的输入文件. # 产生从1到10的数,步长为1 $ seq 1 10 1 2 3 4 5 6 7 ...

  7. vs2013打包

    C#打包需要这个:InstallShield 2013 Limited Edition for Visual Studio  . 下载地址: InstallShield 2013 Limited Ed ...

  8. PHPExcel导入

    PHPExcel 是用来操作Office Excel 文档的一个PHP类库,可以使用它来读取.写入不同格式的电子表格 Github:https://github.com/PHPOffice/PHPEx ...

  9. SQL删除重复数据(根据多个字段)，pandas的nan存入数据库报错

    delete from M_FACTOR_DATA_TEST a where (a.factor_id,a.data_date,a.stock_code) in (select factor_id,d ...

  10. Python学习第二阶段Day2，模块time/datetime、random、os、sys、shutil

    1.Time.  Datetime(常用) UTC时间:为世界标准时间,时区为0的时间 北京时间,UTC+8东八区 import time print(time.time()) # timestamp ...