物件的建立
如果要建立一個物件，就像下面這樣
| var house = new Object(); | |
| house.color = "white"; | |
| house.doors = 6; | |
| house.room = 4; | |
| house.doorNum = function(){ | |
| alert(this.room); | |
| } | |
| house.doorNum(); |
但是現在可以改用實字的方式建立，結構會更清楚喔
| var house = { | |
| color : "white", | |
| doors : 6, | |
| room : 4, | |
| doorNum : function() { | |
| alert(this.room); | |
| } | |
| } | |
| house.doorNum(); |
另一個使用實字的原因，如果你在區域範圍內用 Object 去建構的話
假設你外圍有相同名字的建構式，那解譯器會從你呼叫Object() 的區域開始向外找
直到找到全域為止
你也可以使用下面這種方式來自行定義建構函式
以下範例摳比書上
| var Person = function (name) { | |
| this.name = name; | |
| this.say = function() { | |
| return "I am " + this.name; | |
| }; | |
| } | |
| //建立 | |
| var adm = new Person("Adam"); | |
| adam.say(); // "I am Adam" |
這個例子中每次 new Person() 的時候，一個新的say 函數就會建立在記憶體中
這樣非常浪費效能，因為每個物件的say() 方法都一樣，但卻在記憶體中有很多份
因此最好的寫法是把 say() 寫在物件的原型裡，如下
| Person.prototype.say = function() { | |
| return "I am " + this.name; | |
| }; |
所以日後如果有會重複利用到的方法或成員，都要盡量用prototype加入物件的原型中
那如果是陣列呢? 陣列也有陣列實字
| var arr = new Array("a","b","c"); | |
| //改成陣列實字 | |
| var arr = ["a","b","c"]; |
好了，這下就超級清楚了~
從剛剛的 {color:"white"} 到陣列實字 ["a","b","c"]
組合起來不就是現在不用就退流行的 JSON 嗎
標準的 JSON 格式就是這樣啊!
{"color" : "white" , "some" : ["a","b","c"]}
習慣使用物件實字建構方式，從此不用再硬記 JSON 格式的長相了
執行的先後順序與Callback
有的時候執行一段 js 依照工作複雜度，返回的結果會有先後順序
這樣講有點模糊，就例如 AJAX 好了
| function play() { | |
| $.ajax({ | |
| url : 'test.html', | |
| success : function(){ | |
| alert('第一名'); | |
| } | |
| }) | |
| } | |
| function play2() { | |
| alert('第二名'); | |
| } | |
| //呼叫一下兩個 function | |
| play(); | |
| play2(); |
照裡來說應該要先跳出 '第一名' 然後再跳出 '第二名'
上面的結果會先跳出'第二名' 再跳出 '第一名'
因為跳出'第二名' 時，'第一名' 跑去test.html 還沒回來啊!
那要怎麼讓 '第二名' 在 '第一名'之後呢?
改成這樣就可以了
| function play(callback) { | |
| $.ajax({ | |
| url : 'test.html', | |
| success : function(res) { | |
| alert('第一名'); | |
| callback(); | |
| } | |
| }) | |
| } | |
| function play2() { | |
| alert('第二名'); | |
| } | |
| play(function() { | |
| play2(); | |
| }); | |
| //或是乾脆直接 | |
| play(function() { | |
| alert('第二名'); | |
| }); |
callback 是個好用的東西，在Node.js 裡面就運用了大量的 callback
但Node.js 本人學一點皮毛就跑去玩 AngularJS了 = ="
簡單來說 callback 就是把一個可以執行的函數傳入另一個方法的傳入參數中並執行
setTimeout 這東西大概就是大家最容易理解的 callback 範例了
| setTimeout(function(){ | |
| alert('3秒已過，懺悔吧你!'); | |
| },3000); | |
| //或是這樣寫可能比較清楚 | |
| var msg = function () { | |
| alert('3秒已過，懺悔吧你!'); | |
| } | |
| setTimeout(msg, 3000); |
留言列表
CSS、Responsive Web Design (2)