对new functionName()定义一个函数的理解


Posted in Javascript onMay 22, 2014

比如定义一个函数的两种调用方法:

function getInfo() { 
var info = { 
message: "message" 
}; 
return info; 
}

1、var info1 = getInfo();

2、var info2 = new getInfo();

1和2有什么区别吗?info1和info2得到的值是一样的吗?

第1种很简单,用的也很多,就是执行一个函数,并接受函数的返回值并赋给info1对象;

第2种情况一般就很少见了。首先,函数也是一种对象,是对象肯定就可以实例化(实例化其实就是调用对象的构造函数对对象进行初始化),所有第2种情况就是调用getInfo函数对象的构造函数,并接收构造函数初始化的实例(一般都是this),而函数有个比较特别的地方就是,如果构造函数有显示返回值,将用该返回值替换this对象返回。所以第2中情况new getInfo就是调用构造函数(函数的构造函数就是其定义本身)并接收返回值info。

应用:

1、比如HTML定义了DOM对象:<div id="domId"></div>,js代码如下:

function $(domId) { 
var dom = document.getElementById(domId); 
return dom; 
} window.onload = function() { 
var dom1 = new $("domId"); 
var dom2 = $("domId"); 
alert(dom1 == dom2); 
}

则alert提示信息将显示true。之所以使用$做函数名,是因为 使用这个函数的时候是不是有点像jQuery的风格呢?其实jQuery的构造函数里就应用了这种风格的函数定义,不管你是用new还是直接调用函数,返回的值都是一样的。

2、定义兼容的XMLHttpRequest对象(本例摘自Javascript权威指南的第18.1节)
大家都知道不同的浏览器对异步通信支持的方式可能不一样,早期的IE是用的ActiveX的方式,下面的代码定义了一个兼容的XMLHttpRequest对象:

if (window.XMLHttpRequest === undefined) { 
window.XMLHttpRequest = function() { 
try { 
//如果可用,则使用ActiveX对象最新的版本 
return new ActiveXObject("Msxml2.XMLHTTP.6.0"); 
} catch (ex1) { 
try { 
return new ActiveXObject("Msxml2.XMLHTTP.3.0"); 
} catch (ex2) { 
throw new Error("XMLHttpRequest is not supported") 
} 
} 
} 
}

这样,就可以直接通过 var xhr = new XMLHttpRequest()定义了,而不用管是IE浏览器还是火狐浏览器。
Javascript 相关文章推荐
Javascript面向对象设计一 工厂模式
Dec 20 Javascript
Firefox中使用outerHTML的2种解决方法
Jun 07 Javascript
浅谈JavaScript的事件
Feb 27 Javascript
tuzhu_req.js 实现仿百度图片首页效果
Aug 11 Javascript
JavaScript实现带缓冲效果的随屏滚动漂浮广告代码
Nov 06 Javascript
js实现上传图片及时预览
May 07 Javascript
JavaScript生成带有缩进的表格代码
Jun 15 Javascript
jquery tmpl模板(实例讲解)
Sep 02 jQuery
详解vue-router 命名路由和命名视图
Jun 01 Javascript
JQuery实现ul中添加LI和删除指定的Li元素功能完整示例
Oct 16 jQuery
JavaScript中的各种宽高属性的实现
May 08 Javascript
vue中使用腾讯云Im的示例
Oct 23 Javascript
教你如何使用PHP输出中文JSON字符串
May 22 #Javascript
JS完整获取IE浏览器信息包括类型、版本、语言等等
May 22 #Javascript
JS常用表单验证方法总结
May 22 #Javascript
一个Action如何调用两个不同的方法
May 22 #Javascript
选择复选框按钮置灰否则按钮可用
May 22 #Javascript
JavaScript获取路径设计源码
May 22 #Javascript
javascript学习笔记--数字格式类型
May 22 #Javascript
You might like
DC的38部超级英雄动画电影
2020/03/03 欧美动漫
PHP的一个完美GIF等比缩放类,附带去除缩放黑背景
2014/04/01 PHP
JavaScript判断窗口是否最小化的代码(跨浏览器)
2010/08/01 Javascript
jquery乱码与contentType属性设置问题解决方案
2013/01/07 Javascript
Extjs实现进度条的两种便捷方式
2013/09/26 Javascript
基于javascript实现根据身份证号码识别性别和年龄
2016/01/22 Javascript
超链接怎么正确调用javascript函数
2016/05/23 Javascript
jQuery基础知识点总结(DOM操作)
2016/06/01 Javascript
Javascript获取随机数的实现方法
2016/06/22 Javascript
Laydate时间组件在火狐浏览器下有多时间输入框时只能给第一个输入框赋值的解决方法
2016/08/18 Javascript
基于Node.js + WebSocket打造即时聊天程序嗨聊
2016/11/29 Javascript
关于JavaScript中的this指向问题总结篇
2017/07/23 Javascript
vue.js声明式渲染和条件与循环基础知识
2017/07/31 Javascript
Vue实战之vue登录验证的实现代码
2017/10/31 Javascript
浅谈在node.js进入文件目录的问题
2018/05/13 Javascript
vue 优化CDN加速的方法示例
2018/09/19 Javascript
Vue数据双向绑定的深入探究
2018/11/27 Javascript
小程序click-scroll组件设计
2019/06/18 Javascript
javascript中的this作用域详解
2019/07/15 Javascript
浅谈vuex为什么不建议在action中修改state
2020/02/02 Javascript
Windows下用py2exe将Python程序打包成exe程序的教程
2015/04/08 Python
Python设置默认编码为utf8的方法
2016/07/01 Python
Python使用cx_Oracle调用Oracle存储过程的方法示例
2017/10/07 Python
pandas表连接 索引上的合并方法
2018/06/08 Python
django-rest-framework解析请求参数过程详解
2019/07/18 Python
python 计算概率密度、累计分布、逆函数的例子
2020/02/25 Python
深入理解Python变量的数据类型和存储
2021/02/01 Python
数学专业毕业生自荐信
2013/11/10 职场文书
2014年9.18纪念日演讲稿
2014/09/14 职场文书
机关干部作风建设剖析材料
2014/10/23 职场文书
奥巴马开学演讲观后感
2015/06/12 职场文书
法定代表人身份证明书
2015/06/18 职场文书
房屋所有权证明
2015/06/19 职场文书
2015年高三年级组工作总结
2015/07/21 职场文书
2015年中秋放假通知范文
2015/08/18 职场文书
该怎么书写道歉信?
2019/07/03 职场文书