Posted on 2007-09-14 08:35
puras 閱讀(1708)
評論(0) 編輯 收藏 所屬分類:
JavaScript
作者:赫連紫軒(puras)
最近在看ExtJS,jQuery這些JS的框架
發現里面有很多基礎的東西居然都不明白
無奈只能找本書復習復習基礎啦
隨手就記了點
- 共有5種原始類型:Undefined, Null, Boolean, Number和String
- 使用typeof運算符來判斷一個值的類型
- 值null和值undefined是相等的
- NaN不能用于計算,并與自身不相等
- 位運算NOT實質上是對數字求負,然后減1,因此,25變為-26
- 如果函數無明確的返回值,或調用了沒有參數的return語句,那么它真正返回的值是undefined
定義類或對象的方式
工廠方式:
function showColor() 
{
alert(this.color);
}
function createCar(sColor, iDoors, iMpg) {
var oTempCar = {};
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.mpg = iMpg;
oTempCar.showColor = showColor;
return oTempCar;
}
var oCar1 = createCar('red', 4, 23);
var oCar2 = createCar('blue', 2, 25);
構造函數方式:
function showColor() {
alert(this.color);
}
function Car(sColor, iDoors, iMpg) {
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.showColor = showColor;
}
var oCar1 = new Car('red', 4, 23);
var oCar2 = new Car('blue', 2, 25);
原型方式:
function Car() {}
Car.prototype.color = 'red';
Car.prototype.doors = 4;
Car.prototype.mpg = 23;
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();
混合的構造函數/原型方式(推薦使用):
function Car(sColor, iDoors, iMpg) {
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
}
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car('red', 4, 23);
var oCar2 = new Car('blue', 2, 25);
動態原型方法:
function Car(sColor, iDoors, iMpg) {
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
if (typeof Car._initialized == 'undefined') {
Car.prototype.showColor = function() {
alert(this.color);
}
Car._initialized = true;
}
}
混合工廠方法:
function Car() {
var oTempCar = new Object();
oTempCar.color = 'red';
oTempCar.doors = 4;
oTempCar.mpg = 23;
oTempCar.showColor = function() {
alert(this.color);
};
return oTempCar;
}
var car = new Car();
繼承的方式
對象冒充:
function ClassA(sColor) {
this.color = sColor;
this.sayColor = function() {
alert(this.color);
}
}
function ClassB(sColor, sName) {
this.newMethod = ClassA;
this.newMethod(sColor);
delete this.newMethod;
this.name = sName;
this.sayName = function() {
alert(this.name);
}
}
子類的新屬性和方法必須在刪除父類之后定義
call()方法:
function ClassA(sColor) {
this.color = sColor;
this.sayColor = function() {
alert(this.color);
}
}
function ClassB(sColor, sName) {
ClassA.call(this, sColor);
this.name = sName;
this.sayName = function() {
alert(this.name);
}
}
apply()方法:
function ClassA(sColor) {
this.color = sColor;
this.sayColor = function() {
alert(this.color);
}
}
function ClassB(sColor, sName) {
ClassA.call(this, new Array(sColor));
//ClassA.call(this, arguments); //當父類和子類的參數順序完全一致時可使用此方法
this.name = sName;
this.sayName = function() {
alert(this.name);
}
}
原型鏈:
function ClassA() {
}
ClassA.prototype.color='red';
ClassA.prototype.sayColor = function() {
alert(this.color);
};
function ClassB() {
}
ClassB.prototype = new ClassA();
ClassB.prototype.name = '';
ClassB.prototype.sayName = function() {
alert(this.name);
};
混合方式:
function ClassA(sColor) {
this.color = sColor;
}
ClassA.prototype.sayColor = function() {
alert(this.color);
};
function ClassB(sColor, sName) {
ClassA.call(this, sColor);
this.name = sName;
}
ClassB.prototype = new ClassA();
ClassB.prototype.sayName = function() {
alert(this.name);
}
朋友寫的一種繼承方式,感覺比上面幾種都要好:
Function.prototype.extend = function (Base) {
var Prototype = function () {};
Prototype.prototype = Base.prototype;
this.prototype = new Prototype();
this.prototype.base = Base;
this.prototype.constructor = this;
}
function Bird(name) {
this.name = name;
}
Bird.prototype.fly = function() {
alert(this.name + " is flying");
}
function Duck(name, owner) {
this.base(name);
this.owner = owner;
}
Duck.extend(Bird);
Duck.prototype.fly = function () {
alert(this.name + " is a duck!");
}
new Duck("duck A").fly();
但這種寫法有個問題
就是無法多層繼承
雖然又加了點東西可以實現多層繼承了
但還是不如上面其他方式的寫法好(個人感覺)