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

<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. PAT A 1018. Public Bike Management (30)【最短路径】

    https://www.patest.cn/contests/pat-a-practise/1018 先用Dijkstra算出最短路,然后二分答案来验证,顺便求出剩余最小,然后再从终点dfs回去求出路 ...

  2. MySQL 5.7 解压版安装配置

    测试环境 系统:Windows 10专业版 版本:MySQL Server 5.7.14   提纲 修改配置文件 初始化 安装服务.启动服务 修改root密码   步骤 1.解压安装包 在MySQL官 ...

  3. 两个dropDownList和一个GridView的选择与显示

    很久没有写ASP.NET了,今天有看到论坛上一个问题:"两个dropDownList和一个GridView,已经进行了数据绑定,现在想让第一个下拉菜单的数据改变时,第二个下拉菜单自动变到相应 ...

  4. CSRF 攻击原理和防御方法

    1. CSRF攻击原理 CSRF(Cross site request forgery),即跨站请求伪造.我们知道XSS是跨站脚本攻击,就是在用户的浏览器中执行攻击者的脚本,来获得其cookie等信息 ...

  5. c#ASP.NET中页面传值共有这么几种方式

    一.目前在ASP.NET中页面传值共有这么几种方式: 1.Response.Redirect("http://www.hao123.com",false); 目标页面和原页面可以在 ...

  6. select 函数实现 三种拓扑结构 n个客户端的异步通信 (完全图+线性链表+无环图)

    一.这里只介绍简单的三个客户端异步通信(完全图拓扑结构) //建立管道 mkfifo open顺序: cl1 读 , cl2 cl3 向 cl1写 cl2 读 , cl1 cl3 向 cl2写 cl3 ...

  7. Post data using ajax in laravel 5

    转自:http://www.tuicool.com/articles/2u2mmmu Post data using ajax in laravel 5 to controller If you ar ...

  8. 【python】json中字典key不可为数值型

    遇到了一个很诡异的错误.写一个字典,存入json文件.之后读出判断是否存在key.结果惊奇的发现,同一个key居然存在两次. 原因:json会将数值key转换为unicode 结论:使用json时字典 ...

  9. Windows 95 输入法编辑器

    Windows 95 输入法编辑器 翻译:戴石麟译自微软的MSDN DDK 关于Windows 95的多语言IME(输入法编辑器) 在Windows 95中,IME以动态连接库(DLL)的形式提供,与 ...

  10. Java开发 - 异常 - 使用throws

    如果一个方法可能会产生异常,我们需要用throws关键字给它标注会抛出什么异常, 这样就可以在方法调用的时候捕获它. 代码如下: package corejava8.exceptions; publi ...