JavaScript中使用構(gòu)造器創(chuàng)建對象無需new的情況說明
更新時間:2012年03月01日 22:32:50 作者:
JS中創(chuàng)建對象可以直接使用直接量的方式,這里討論的是定義一個構(gòu)造器(function)的情況
如下
復(fù)制代碼 代碼如下:
function Person(name, age) {
this.name = name;
this.age = age;
}
var p = new Person('lily', 20);
this.name = name;
this.age = age;
}
var p = new Person('lily', 20);
發(fā)現(xiàn)某些庫代碼中創(chuàng)建正則對象的方式無需new,這讓人感到奇怪。如下
復(fù)制代碼 代碼如下:
var reg = RegExp('^he$');
測試發(fā)現(xiàn)使用或不使用new,最后返回的都是正則對象,且typeof它們都是“object”。
復(fù)制代碼 代碼如下:
var reg1 = new RegExp('^he$');
var reg2 = RegExp('^he$');
reg1.test('he'); // true
reg2.test('he'); // true
console.log(typeof reg1); // object
console.log(typeof reg2); // object
var reg2 = RegExp('^he$');
reg1.test('he'); // true
reg2.test('he'); // true
console.log(typeof reg1); // object
console.log(typeof reg2); // object
嗯,挺好,代碼運(yùn)行正常。
如果這樣的話干脆就不寫new了,這么還節(jié)省了代碼量。其它類型也是這樣嗎?試試String/Number/Boolean。
復(fù)制代碼 代碼如下:
var str1 = new String(1);
var str2 = String(1);
var num1 = new Number('1');
var num2 = Number('1');
var boo1 = new Boolean(1);
var boo2 = Boolean(1);
console.log(typeof str1); // object
console.log(typeof str2); // string
console.log(typeof num1); // object
console.log(typeof num2); // number
console.log(typeof boo1); // object
console.log(typeof boo2); // boolean
var str2 = String(1);
var num1 = new Number('1');
var num2 = Number('1');
var boo1 = new Boolean(1);
var boo2 = Boolean(1);
console.log(typeof str1); // object
console.log(typeof str2); // string
console.log(typeof num1); // object
console.log(typeof num2); // number
console.log(typeof boo1); // object
console.log(typeof boo2); // boolean
可以看到,與正則的情況不同。正則無論是否new,typeof后都是object。
但String/Number/Boolean類型,new的對象typeof返回是“object”,不new的typeof返回則是“string”。
即不適用new的情況可以將其它類型分別轉(zhuǎn)化成字符串,數(shù)字和布爾類型。
好了,再回到篇頭的那個Person類。即我們自己寫的類可以不用new操作符生成對象嗎?
復(fù)制代碼 代碼如下:
function Person(name, age) {
this.name = name;
this.age = age;
}
var p = Person('lily', 20);
console.log(p); // undefined
this.name = name;
this.age = age;
}
var p = Person('lily', 20);
console.log(p); // undefined
返回undefined,很明顯不行。因此想不用new的情況去創(chuàng)建Person實(shí)例是異想天開的。
如果非要實(shí)現(xiàn)呢?其實(shí)也行,如下
復(fù)制代碼 代碼如下:
function Person(name, age) {
this.name = name;
this.age = age;
if (this===window) {
return new Person(name, age);
}
}
var p = Person('lily', 20); // object
this.name = name;
this.age = age;
if (this===window) {
return new Person(name, age);
}
}
var p = Person('lily', 20); // object
稍微改造了下Person類。實(shí)際上內(nèi)部區(qū)分了下Person是作為構(gòu)造器還是函數(shù)執(zhí)行。
您可能感興趣的文章:
- 用方法封裝javascript的new操作符(一)
- 淺談javascript中new操作符的原理
- JS重學(xué)系列之聊聊new操作符
- js構(gòu)造函數(shù)創(chuàng)建對象是否加new問題
- JavaScript 三種創(chuàng)建對象的方法
- JS 創(chuàng)建對象(常見的幾種方法)
- js中創(chuàng)建對象的幾種方式示例介紹
- js創(chuàng)建對象的幾種常用方式小結(jié)(推薦)
- js面向?qū)ο笾R妱?chuàng)建對象的幾種方式(工廠模式、構(gòu)造函數(shù)模式、原型模式)
- javascript的函數(shù)、創(chuàng)建對象、封裝、屬性和方法、繼承
- JS使用new操作符創(chuàng)建對象的方法分析
相關(guān)文章
javascript中Date對象應(yīng)用之簡易日歷實(shí)現(xiàn)
這篇文章主要為大家詳細(xì)介紹了javascript中Date對象應(yīng)用之簡易日歷實(shí)現(xiàn),具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-07-07
JS判斷元素是否存在數(shù)組中的5種方式總結(jié)
數(shù)組是我們編程中經(jīng)常使用的的數(shù)據(jù)結(jié)構(gòu)之一,在處理數(shù)組時我們經(jīng)常需要在數(shù)組中查找特定的值,下面這篇文章主要給大家總結(jié)介紹了關(guān)于JS判斷元素是否存在數(shù)組中的5種方式,需要的朋友可以參考下2023-03-03
extjs中form與grid交互數(shù)據(jù)(record)的方法
這篇文章介紹了extjs中form與grid交互數(shù)據(jù)(record)的方法,有需要的朋友可以參考一下2013-08-08
微信小程序?qū)W習(xí)筆記之本地?cái)?shù)據(jù)緩存功能詳解
這篇文章主要介紹了微信小程序?qū)W習(xí)筆記之本地?cái)?shù)據(jù)緩存功能,結(jié)合實(shí)例形式分析了微信小程序wx.setStorage、wx.getStorage以及wx.removeStorage、wx.clearStorage針對數(shù)據(jù)緩存的存取、刪除等相關(guān)操作技巧,需要的朋友可以參考下2019-03-03
基于JavaScript實(shí)現(xiàn)回到頁面頂部動畫代碼
這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)回到頁面頂部動畫代碼的相關(guān)資料,代碼簡單易用,非常實(shí)用,需要的朋友可以參考下2016-05-05
jQuery ajax(復(fù)習(xí))—Baidu ajax request分離版
你沒有看錯標(biāo)題,本文的確是在講Baidu ajax,不過是很久很久以前的版本了,我們先分析一段簡單的ajax代碼,來自早期的百度七巧板項(xiàng)目通過這個來先復(fù)習(xí)一遍ajax的知識2013-01-01

