reference: Ajax in Action (天瓏)
JavaScript and Object Oriented Programming (OOP)
static member
by 蘇德宙, 2011-02-05 12:06, 人氣(1352)
Associated array
var obj = new Object(); // create
obj.size = 12; // attribute, dynamically
obj['size'] = 12; // equivalent to obj.size, associated array
obj.show = function() { // method
alert(this.size);
}
function foo() { ... }
obj.show = foo; // pre-defined function
by 蘇德宙, 2011-02-05 12:08, 人氣(1251)
JSON (Javascript Object Notation)
var obj = { // object {}
key1: "v1", // key: value
"key 2": "v2", // "k e y": value
ary: [1, 2, 3], // array []
aryObj: [
{name: "su", age: 10},
{name: "liu", age: 12}
],
date: new Date(1605, 11, 05), // evaluated dynamically
sum: function(val) { // define a method
return val + this.key1;
}
}
by 蘇德宙, 2011-02-05 20:28, 人氣(1389)
// object constructor function
function obj(name, size) {
this.name = name;
this.size = size;
}
obj.prototype.tellSize = function() { return this.size; }
var o1 = new obj(); // no color
obj.prototype.color = "blue";
var o2 = new obj(); // has color
by 蘇德宙, 2011-02-05 20:37, 人氣(1521)
// 盡量不要擴充內建型別的原型,缺點主要是難以維護,尤其別人使用時
Array.prototype.indexOf = function(obj) {
var ret = -1;
for (var i=0; i<this.length; i++)
if (this[i] == obj) { ret = i; break; }
return ret;
}
Array.prototype.contains = function(obj) {
return (this.indexOf(obj) >= 0);
}
Array.prototype.append = function(obj, nodup) {
nodup = nodup || false; // default
if (this.contains(obj) && nodup) return;
this[this.length] = obj;
}
var num = [1, 2, 3, 4, 5];
num.append(6);
by 蘇德宙, 2011-02-05 16:18, 人氣(1451)
var animal = function() {
this.eat = function() { alert("animal eat"); }
this.walk = function() { alert("animal walk"); }
}
this.eat = function() { alert("animal eat"); }
this.walk = function() { alert("animal walk"); }
}
var dog = function() {
this.play = function() { alert("dog play"); }
this.walk = function() { alert("dog walk"); }
}
this.play = function() { alert("dog play"); }
this.walk = function() { alert("dog walk"); }
}
dog.prototype = new animal;
var bill = new dog();
bill.play();
bill.eat();
bill.walk();
bill.play();
bill.eat();
bill.walk();
by 蘇德宙, 2011-02-05 21:22, 人氣(1450)
instanceof
explore attributes & functions
function obj() {
this.color = "red";
this.flavor = "strawberry";
this.func = function() {};
}
var o = new obj();
for (var i in o)
console.log(o[i]);
by 蘇德宙, 2011-02-05 21:32, 人氣(1382)
Object.prototype.implements = function(funcName) {
return this && this[funcName] && this[funcName] instanceof Function;
}
function isShape(obj) {
return obj.implements("getArea"); // 檢查是否 implement getArea() 的介面
}
function addAreas(s1, s2) {
if (isShape(s1) && isShape(s2))
return s1.getArea() + s2.getArea();
}
by 蘇德宙, 2012-06-06 12:15, 人氣(1367)
this 一般會指向 global,因此如果是物件,要特別小心要用 new
function obj() {
this.value = "v";
}
var o = obj(); // 錯誤,this 指向 global, browser 中通常是 window
var o = new obj(); // this 指向物件
解決方法 ~ 自我呼叫的建構式
function obj() {
if (!(this instanceof obj)) {
return new obj();
}
this.value = "v";
}