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

 更新时间:2014年05月22日 10:45:00   作者:  
这篇文章主要介绍了对new functionName()定义一个函数的理解,需要的朋友可以参考下
比如定义一个函数的两种调用方法:
复制代码 代码如下:

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浏览器还是火狐浏览器。

相关文章

  • js阻止默认事件与js阻止事件冒泡示例分享 js阻止冒泡事件

    js阻止默认事件与js阻止事件冒泡示例分享 js阻止冒泡事件

    嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,下面介绍一下js阻止默认事件与js阻止事件冒泡示例,大家参考使用吧
    2014-01-01
  • JavaScript正则表达式的分组匹配详解

    JavaScript正则表达式的分组匹配详解

    本文给大家详细介绍了JavaScript正则表达式的分组匹配的概念以及具体的使用方法并附上了相关示例,有需要的小伙伴可以参考下。
    2016-02-02
  • JavaScript基础知识学习笔记

    JavaScript基础知识学习笔记

    本文是初学javascript的时候记的学习笔记,简单介绍了javascript的定义及用法,并附上示例,适合初学者们,老鸟请出门左转。
    2014-12-12
  • 深入理解javascript作用域和闭包

    深入理解javascript作用域和闭包

    作用域和作用域链是javascript中非常重要的特性,对于他们的理解直接关系到对于整个javascript体系的理解,而闭包又是对作用域的延伸,也是在实际开发中经常使用的一个特性,实际上,不仅仅是javascript,在很多语言中都提供了闭包的特性。
    2014-09-09
  • 原生javascript 学习之js变量全面了解

    原生javascript 学习之js变量全面了解

    下面小编就为大家带来一篇原生javascript 学习之js变量全面了解。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-07-07
  • 老生常谈js数据类型

    老生常谈js数据类型

    下面小编就为大家带来一篇老生常谈js数据类型。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • JavaScript中的some()方法使用详解

    JavaScript中的some()方法使用详解

    这篇文章主要介绍了JavaScript中的some()方法使用详解,是JS入门学习中的基础知识,需要的朋友可以参考下
    2015-06-06
  • JavaScript基本编码模式小结

    JavaScript基本编码模式小结

    本文中笔者整理的这些模式包含了编写JavaScript代码时一些常用的方法或者小技巧,可以帮助初学JavaScript的同学迅速提升代码质量
    2012-05-05
  • 想学习javascript JS和jQuery哪个重要 先学哪个

    想学习javascript JS和jQuery哪个重要 先学哪个

    在一些技术论坛与qq群经常看到有这样类似的提问,当然提出这样问题的通常都是新手为了解决大家的疑惑,同时帮助新手程序员能更快掌握学习的方向,不致于弄错重点
    2016-12-12
  • js数组直接赋值的问题(js数组的浅拷贝与深拷贝方法)

    js数组直接赋值的问题(js数组的浅拷贝与深拷贝方法)

    JS数组在直接赋值时属于数组的浅拷贝,新数组保存的是原数据的内存地址,修改新数组或原数组其中一个数组,另一个数组也会相应的变化,数组的直接赋值属于数组的浅拷贝,JS存储对象都是存内存地址
    2022-10-10

最新评论