快捷導(dǎo)航

JS訪問(wèn)對(duì)象兩種方式區(qū)別解析

更新時(shí)間：2020年08月29日 10:42:42 作者：小猿筆記

這篇文章主要介紹了JS訪問(wèn)對(duì)象兩種方式區(qū)別解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下

可以使用下面兩種方式訪問(wèn)對(duì)象的屬性和方法

1.對(duì)象名.屬性名　　　　對(duì)象名.方法名()

2.對(duì)象名["屬性名"]　　　對(duì)象名"方法名"

   var obj = {
         name : "小明",
         age : 18,
         say : function(){
           console.log("我是"+this.name+"我"+this.age+"歲");
         }      
     };
     console.log(obj.name);
     console.log(obj["name"]);
     obj.say();
     obj["say"]();

對(duì)于已經(jīng)存在的屬性和方法，用.和用[]得到的結(jié)果一致、

對(duì)于不存在(未定義)的屬性和方法，用.會(huì)創(chuàng)建這個(gè)新的屬性或方法，而用[]的方式訪問(wèn)不會(huì)創(chuàng)建新的屬性或方法

例如在用for-in遍歷對(duì)象時(shí)

    for(var x in obj){      
      console.log(x);    //輸出obj中的屬性名，方法名
      console.log(obj.x);//想要用.的方法輸出對(duì)應(yīng)的屬性和方法  結(jié)果是undefined，原因在于JS語(yǔ)言中.方法可以用來(lái)聲明，聲明對(duì)象屬性的方式就是屬性名.屬性值
　　　　　　　　　　　　　　　　　　　//這里實(shí)際先聲明了obj的x屬性，并且未初始化該屬性，然后輸出了該屬性值，所以為undefined
　　　　　}

利用[]方式只能訪問(wèn)和讀取，不會(huì)定義新的屬性

for(var x in obj){      
      console.log(x);    //輸出obj中的屬性名，方法名
      console.log(obj[x]);//輸出對(duì)應(yīng)的屬性值和方法，方法未調(diào)用所以輸出的是方法的代碼
    }

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

JS 新增Cookie 取cookie值刪除cookie 舉例詳解
cookie很實(shí)用的一個(gè)功能，可以判斷某個(gè)狀態(tài)，下面與大家分享下JS 如何新增Cookie 取cookie值刪除cookie，感興趣的朋友可以參考下
2014-10-10
移動(dòng)端圖片上傳旋轉(zhuǎn)、壓縮問(wèn)題的方法
在本篇文章中我們給大家分享了關(guān)于移動(dòng)端圖片上傳旋轉(zhuǎn)、壓縮問(wèn)題的解決方法，有需要的朋友們參考下
2018-10-10
原生js實(shí)現(xiàn)簡(jiǎn)單輪播圖
這篇文章主要為大家詳細(xì)介紹了原生js實(shí)現(xiàn)簡(jiǎn)單輪播圖，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-10-10
詳解webpack-dev-server 設(shè)置反向代理解決跨域問(wèn)題
后端只負(fù)責(zé)接口，前端負(fù)責(zé)數(shù)據(jù)展示、邏輯處理。那么如何跨域？這篇文章主要介紹了webpack-dev-server 設(shè)置反向代理解決跨域問(wèn)題，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2018-04-04
uniapp實(shí)現(xiàn)單選框的示例代碼
本文給大家介紹uniapp實(shí)現(xiàn)單選框的示例代碼,采用uniapp-vue3實(shí)現(xiàn)的一款單選框組件,提供絲滑的動(dòng)畫(huà)選中效果,支持不同主題配置,適配web、H5、微信小程序,感興趣的朋友跟隨小編一起看看吧
2024-03-03
JavaScript ECMA-262-3 深入解析（一）：執(zhí)行上下文實(shí)例分析
這篇文章主要介紹了JavaScript ECMA-262-3 執(zhí)行上下文,結(jié)合實(shí)例形式詳細(xì)分析JavaScript ECMA執(zhí)行上下文相關(guān)概念、原理與操作注意事項(xiàng),需要的朋友可以參考下
2020-04-04
微信小程序?qū)崿F(xiàn)計(jì)算器案例
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)計(jì)算器案例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-07-07
JS pushlet XMLAdapter適配器用法案例解析
這篇文章主要介紹了JS pushlet XMLAdapter適配器用法案例解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-10-10
JS針對(duì)Array的各種操作匯總
這篇文章主要為大家詳細(xì)介紹了JS針對(duì)Array的各種操作,如何創(chuàng)建Array,數(shù)組的一些簡(jiǎn)單和基本的操作,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-11-11
JS中解決谷歌瀏覽器記住密碼輸入框顏色改變功能
這篇文章主要介紹了JS中解決谷歌瀏覽器記住密碼輸入框顏色改變功能,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-02-02