對javascript對象的理解

   說實話,之前會用js,就是在標籤上綁定個事件,就像 <span onclick="doSome()"></span>,在script中寫 function doSome(){} .至於對象,呵呵,徹底不懂.java

   在個人理解中,js的對象和 java中的對象很類似,原本就是嘛,這兩個有着千絲萬縷的聯繫.不一樣的是,java中用class 當前綴,如 public class Person{} ,而在js中,用 function Person(){}.當咱們這樣:  var person =new Person(); 一個person 對象就生成了.裏面是空的 .而若是代碼是這樣:瀏覽器

function Person(name,age){dom

this.name=name;this

this.age=age;spa

}對象

var person =new Person("xiaoxiao",25);事件

這個person對象,他的名字就是"xiaoxiao" ,age=25ip

用console.log("person名字是--->"+person.name+"  年齡是"+person.age);能夠在控制檯打印出來.作用域

在js中,也能夠這樣直接獲得一個對象: var obj={};get

可是裏面的值要這樣形式:{arg1:"xiaofeiji",arg2:20}

鍵值對的形式,中間用 逗號 分開來.鍵通常都是string類型,值能夠任意,若是是數字,能夠直接寫,若是是其餘值,做用域中要能取到.若是沒有,就會這樣  :

Uncaught ReferenceError: a is not defined

運行的時候直接報錯.

值也能夠是一個對象,如把上面的 person放進去. var obj={person:person,title:"我是我的"}

這個時候 obj.person  就是person 了.想取值,再繼續 .屬性

有句話很重要,只有對象才能 .屬性   .對象   

例如,var a="abc"; 要是 a.xxx 絕壁報錯.

關於取值問題,能夠用  obj.title 這樣取值,也能夠用 obj["title"] 這樣取值.

在原生js中,操做dom對象,改變他的樣式,能夠這樣:

var my_dom=document.getElementById("my_dom");

my_dom.style.height="20px";

my_dom.style.width="20px";

my_dom.style.border="1px solid red";

這樣style屬性就改變了.能夠在瀏覽器上直接看出來.

也能夠用這樣的辦法:

my_dom["style"]["height"]="20px";

my_dom["style"]["width"]="20px";

my_dom["style"]["border"]="20px";

是否是感到很奇怪,怎麼會有兩種,就算不感到奇怪,也感受不正常,爲何要兩種呢,一種不就能夠了嗎?其實,第二種方法頗有用的,接下來我就告訴你.

若是有一天,你要把這個作成一個組件,通關傳參來修改 my_dom 的 樣式

你就要這樣寫  function updateStyle(key,value){

                               my_dom.style.key=value;

                        }

原諒我偷懶了,沒有獲取 my_dom 對象就直接用了.上面的寫法錯誤的,不相信的能夠試試.可是,你要是這樣   my_dom.style[key]=value; 這樣就是對的.固然你的值傳的要正確,否則怎麼會有效果.

肚子裏沒幹貨了,就這麼點....雖然 jQuery很好用,可是寫原生 js 仍是好開心,由於這是本身寫的!!

相關文章
相關標籤/搜索