創(chuàng)建、調(diào)用JavaScript對(duì)象的方法集錦
今天在做項(xiàng)目時(shí),遇到了需要?jiǎng)?chuàng)建JavaScript對(duì)象的情況。所以Bing了一篇老外寫的關(guān)于3種創(chuàng)建JavaScript對(duì)象的文章,看后跟著打了一遍代碼。感覺方法挺好的,在這里與大家分享一下。
一、利用函數(shù)創(chuàng)建對(duì)象:
//定義對(duì)象
function Animal(type)
{
this.name="";
this.type=type;
this.introduction=function(){
return "我的名字是: "+this.name+",我屬于 "+this.type;
}
}
var animal=new Animal("家禽"); //實(shí)例化我們上面創(chuàng)建的對(duì)象
animal.name="小紅";
alert(animal.introduction()); //調(diào)用它的introduction函數(shù)(此時(shí),頁(yè)面會(huì)彈出:我的名字是 小紅,我屬于 家禽);
這種方法,大家一定都很熟悉了。但是,使用這種方法會(huì)造成性能的損耗。在這里,我們是通過new關(guān)鍵子來實(shí)例化對(duì)象的。其實(shí),new關(guān)鍵子是做了兩件事。一,定義了一個(gè)匿名方法(Animal)。二、調(diào)用它。這樣就不如我們接下來要介紹的方法高效了。
二、利用對(duì)象字面量(object literals):
不知道翻譯的對(duì)不對(duì),待會(huì)我會(huì)把原文地址告訴大家,有興趣的可以看原文。
//定義對(duì)象
var Book=
{
name:"紅樓夢(mèng)",
type:"文學(xué)作品",
getAuthor:function()
{
return :"我是曹雪芹的孩子!";
}
}
alert(Book.GetAuthor()); //調(diào)用對(duì)象方法,此時(shí)頁(yè)面會(huì)出現(xiàn):我是曹雪芹的孩子。
Book.name="灌籃"; //修改對(duì)象屬性
alert(Book.name); //此時(shí),頁(yè)面會(huì)彈出:灌籃
相信大家看到代碼,應(yīng)該明白了為什么說這個(gè)方法會(huì)高效一些了。因?yàn)?,它相?dāng)于定義了一個(gè)JavaScript全局變量。我們可以直接用它,不需要實(shí)例化它。但是,這樣看起來怪怪的啊。那么,解決方案來了。我們來看看第三種方法吧。
三、單例模式(Singleton using a function):
翻譯成單例模式,可能不是太妥。先看代碼吧:
//定義對(duì)象
var Gender=new function()
{
this.type="女生";
this.speaking=function()
{
return "我是"+this.type;
}
}
alert(Gender.speaking();) //使用對(duì)象 此時(shí)頁(yè)面會(huì)出現(xiàn):我是女生。
大家看這段兒代碼,是不是與我們的方法一很像呢?但是,它可像方法一那樣工作的。方法一,用一次對(duì)象,就要?jiǎng)?chuàng)建一次對(duì)象。這個(gè)方法,創(chuàng)建一次對(duì)象,就可以永久使用。所以,這種方式,很類似于設(shè)計(jì)模式中的單例模式。
- javaScript對(duì)象和屬性的創(chuàng)建方法
- JavaScript 創(chuàng)建對(duì)象
- JavaScript 三種創(chuàng)建對(duì)象的方法
- JavaScript 基于原型的對(duì)象(創(chuàng)建、調(diào)用)
- javascript轉(zhuǎn)換字符串為dom對(duì)象(字符串動(dòng)態(tài)創(chuàng)建dom)
- javascript 函數(shù)調(diào)用的對(duì)象和方法
- javascript的函數(shù)、創(chuàng)建對(duì)象、封裝、屬性和方法、繼承
- Javascript創(chuàng)建自定義對(duì)象 創(chuàng)建Object實(shí)例添加屬性和方法
- JavaScript對(duì)象創(chuàng)建及繼承原理實(shí)例解剖
相關(guān)文章
微信小程序如何實(shí)現(xiàn)精確的日期時(shí)間選擇器
這篇文章主要介紹了微信小程序如何實(shí)現(xiàn)精確的日期時(shí)間選擇器,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-01-01
js基于canvas實(shí)現(xiàn)時(shí)鐘組件
這篇文章主要介紹了js基于canvas實(shí)現(xiàn)時(shí)鐘組件的方法,幫助大家更好的理解和使用JavaScript,感興趣的朋友可以了解下2021-02-02
解決canvas畫布使用fillRect()時(shí)高度出現(xiàn)雙倍效果的問題
下面小編就為大家?guī)硪黄鉀Qcanvas畫布使用fillRect()時(shí)高度出現(xiàn)雙倍效果的問題。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-08-08
JS實(shí)現(xiàn)提示框跟隨鼠標(biāo)移動(dòng)
在本篇內(nèi)容里小編給各位整理了一篇關(guān)于JS實(shí)現(xiàn)提示框跟隨鼠標(biāo)移動(dòng)的相關(guān)實(shí)例代碼,需要的朋友們學(xué)習(xí)下。2019-08-08
css3元素簡(jiǎn)單的閃爍效果實(shí)現(xiàn)(html5 jquery)
本篇文章主要介紹了css3元素簡(jiǎn)單的閃爍效果實(shí)現(xiàn)(html5 jquery) 需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-12-12
微信小程序?qū)崿F(xiàn)左滑動(dòng)刪除效果
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)左滑動(dòng)刪除效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-07-07
js頁(yè)面引導(dǎo)頁(yè)的實(shí)現(xiàn)思路總結(jié)
在同學(xué)們使用某些網(wǎng)站的新版本頁(yè)面的時(shí)候,經(jīng)常會(huì)出現(xiàn)一個(gè)類似于新手引導(dǎo)一樣的效果,本文主要介紹了js頁(yè)面引導(dǎo)頁(yè)的實(shí)現(xiàn)思路總結(jié),感興趣的可以了解一下2023-04-04

