对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 相关文章推荐
动态添加js事件实现代码
Mar 12 Javascript
jquery 滚动条事件简单实例
Jul 12 Javascript
IE中图片的onload事件无效问题和解决方法
Jun 06 Javascript
javascript封装的sqlite操作类实例
Jul 17 Javascript
jQuery实现自动与手动切换的滚动新闻特效代码分享
Aug 27 Javascript
通过点击jqgrid表格弹出需要的表格数据
Dec 02 Javascript
javascript匀速运动实现方法分析
Jan 08 Javascript
jQuery实现背景弹性滚动的导航效果
Jun 01 Javascript
jQuery实现隔行变色的方法分析(对比原生JS)
Nov 18 Javascript
js return返回多个值,通过对象的属性访问方法
Feb 21 Javascript
layui table 列宽百分比显示的实现方法
Sep 28 Javascript
通过vue刷新左侧菜单栏操作
Aug 06 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
德生9700DX电路分析
2021/03/02 无线电
php横向重复区域显示二法
2008/09/25 PHP
PHP fopen 读取带中文URL地址的一点见解
2012/09/25 PHP
php实现按指定大小等比缩放生成上传图片缩略图的方法
2014/12/15 PHP
php中动态变量用法实例
2015/06/10 PHP
100行PHP代码实现socks5代理服务器
2016/04/28 PHP
万能的php分页类
2017/07/06 PHP
PHP使用函数用法详解
2018/09/30 PHP
javascript权威指南 学习笔记之javascript数据类型
2011/09/24 Javascript
web的各种前端打印方法之jquery打印插件jqprint实现网页打印
2013/01/09 Javascript
iframe子页面获取父页面元素的方法
2013/11/05 Javascript
JS实现带缓冲效果打开、关闭、移动一个层的方法
2015/05/09 Javascript
JavaScript的兼容性与调试技巧
2016/11/22 Javascript
vue Render中slots的使用的实例代码
2017/07/19 Javascript
基于LayUI分页和LayUI laypage分页的使用示例
2017/08/02 Javascript
javascript防抖函数debounce详解
2019/06/11 Javascript
JavaScript this使用方法图解
2020/02/04 Javascript
JavaScript组合模式---引入案例分析
2020/05/23 Javascript
Python多线程扫描端口代码示例
2018/02/09 Python
Python堆排序原理与实现方法详解
2018/05/11 Python
python3实现磁盘空间监控
2018/06/21 Python
Django框架实现逆向解析url的方法
2018/07/04 Python
在python里从协程返回一个值的示例
2019/02/19 Python
python如何制作英文字典
2019/06/25 Python
django drf框架中的user验证以及JWT拓展的介绍
2019/08/12 Python
Python函数的定义方式与函数参数问题实例分析
2019/12/26 Python
TensorFlow实现checkpoint文件转换为pb文件
2020/02/10 Python
墨尔本最受欢迎的复古风格品牌:Princess Highway
2018/12/21 全球购物
《七颗钻石》教学反思
2014/02/28 职场文书
《白鹅》教学反思
2014/04/13 职场文书
献爱心捐款倡议书
2014/05/14 职场文书
“四风”问题自我剖析材料思想汇报
2014/09/23 职场文书
用人单位聘用意向书
2015/05/11 职场文书
女方家长婚礼答谢词
2015/09/29 职场文书
php TP5框架生成二维码链接
2021/04/01 PHP
Win11怎么解除儿童账号限制?Win11解除微软儿童账号限制方法
2022/07/07 数码科技