Part I: Inheritance http://www.webreference.com/js/column79/
Part II: Methods http://www.webreference.com/js/column80/
OO的基本特性 inheritance, encapsulation, polymorphism
提供 objects, prototypes, implicit inheritance，沒有classes, instances
prototyping 是瞭解inheritance的核心概念
以js定義function，在function中定義methods
保護 private field data element
context, scope, context switching
***********************
OO的特色 encapsulation 封裝(data and methods), inheritance 繼承, and polymorphism 多型, class, superclass, subclass, override
js 不直接支援inheritance，有兩種方法
1. 用function來實作
function superClass() {
this.bye = superBye;
this.hello = superHello;
}
function subClass() {
// 這兩行用來定義superclass
this.inheritFrom = superClass;
this.inheritFrom();
// override bye這個 method
this.bye = subBye;
}
2. 用prototype
function superClass() {
this.bye = superBye;
this.hello = superHello;
}
function subClass() {
this.bye = subBye;
}
// 這裡用prototype指定 superclass
subClass.prototype = new superClass;
************
object1.prototype.isPrototypeOf(0bject2); 判斷object2裡面是否有object1為prototype
netscape: 以 __proto__ 紀錄 prototype物件
************
用__proto__來模擬 instanceOf
//for NS only
function instanceOf(object, constructorFunction) {
while (object != null) {
if (object == constructorFunction.prototype)
{return true}
object = object.__proto__;
}
return false;
}
************
Object object supports the constructor property
************
js 支援三種object: native, host, and user-defined
native: js 語言支援的物件，包含 Object, Math, and Number
host: browser在載入頁面時產生的物件，包含 document, window, and frames
user-defined: 自訂物件，case-sensitive
The Object object is the base object for all native and user-defined objects. All objects inherit from this superclass.
Object的內容
1. property: constructor
2. methods: isPrototypeOf, hasOwnProperty, toLocaleString, toSource, toString, valueOf
propertyIsEnumerable
*****************
列印 物件property
for (property in ken) {
alert(property);
}
*****************
產生物件
function Employee() {
var registerA = "Initial Value";
function setRegisterA(param) {
registerA = param;
}
this.setRegisterA = setRegisterA;
this.dept = "HR";
this.manager = "John Johnson";
}
***************
定義function的三種方法
1.
function first(param) {
alert(param + " method to define a function");
}
2.
second = function(param)
{alert(param + " method to define a function")};
3.
third = new Function("param",
"alert(param + ' method to define a function')");
****************
Functions in javascript can modify global variables from the outer context.
定義method的時候，就會希望是使用private data member，第三種方法（用Function）會產生錯誤，
所以只能用第一與第二種建立function的方法
function myGlobal() {
var global = 5;
function first(param) {
global += 10;
alert(param + " method shows global to be " + global);
}
this.first = first;
this.second = function(param) {global += 10;
alert(param + " method shows global to be " + global)};
this.third = new Function("param", " global += 10;
alert(param + ' method shows global to be ' + global)");
}
var x = new myGlobal();
***********************
定義Context
有三種context: Global code, Eval code, and Function code
當browser進入一個新的context的時候，就會建立新物件(variable object)，保存新context的變數與function，當browser跳出此context的時候，variable object就會被刪除
global code: 在functions外面執行的codes
eval code: 是透過eval function執行的code
function code: 是在function定義中的code
當browser切換context的時候，就會決定新的scope，進而決定可以存取哪些variables, objects與functions
************
判斷scope
global code的scope包含了兩種物件: global object and variable object
global object就是window這個variable物件，也可以用this來代表window，ex: window.location也可以寫成this.location
eval code的scope等同於calling code的scope，包含global and variable object
function code的scope包含
(1) calling code's execution context的variable objects，包含該function被呼叫時，所定義的所有的variables
(2) outer function的variable object
(3) global object，也就是window
(4) arguments object，包含了所有參數
通常this就代表window，但在object method中，this就是這個method所屬的object
ex:
function ObjectConstructor() {
// 這裡的this就不是window
alert(this.location);
}
// 物件
function createObj() {
// method
var newObject = new ObjectConstructor();
}
***********
強制建立object 的方法
function Employee(a) {
if (!(this instanceof Employee)) return new Employee(a); // 如果這行沒寫的話就會error
this.name = a;
}
function init(){
John = Employee("Johnson"); // 沒有寫 new
alert(John.name);
}
*********
在subclasses之間共用private data
function Shape() {
var area = 50;
this.setArea = function(a) {area = a;};
this.getArea = function() {return area;};
}
function Square() {
}
Square.prototype = new Shape();
var shape1 = new Square();
var shape2 = new Square();
shape1.setArea(100);
****************
保護private data的兩種方法
1. 用call()
function Shape() {
var area = 50;
this.setArea = function(a) {area = a;};
this.getArea = function() {return area;};
}
function SquareB() {
Shape.call(this);
}
var shape1B = new SquareB();
var shape2B = new SquareB();
shape1B.setArea(100);
//shape2B's 的area變數就不會被影響還是50
2. call a constructor from within a constructor
function Shape() {
var area = 50;
this.setArea = function(a) {area = a;};
this.getArea = function() {return area;};
}
function SquareA() {
this.Shape = Shape;
this.Shape();
}
var shape1A = new SquareA();
var shape2A = new SquareA();
shape1A.setArea(100);
//shape2B's 的area變數就不會被影響還是50
