Js 類定義舉例
阿新 • • 發佈：2018-12-16
1、工廠模式
（1）工廠模式1
// 類定義 function Tom() { var tom = new Object; tom.name = ""; tom.age = 0; tom.hand = new Array("left", "right"); tom.rename = function (name) { tom.name = name; }; tom.showInfo = function () { alert("name=" + this.name + ",age=" + this.age); }; return tom; } // 使用 $(function () { var tom = Tom(); });
（2）工廠模式2
// 類定義 function Cat(name, age) { var cat = new Object; cat.name = name; cat.age = age; cat.hand = new Array("left", "right"); cat.rename = function (name) { cat.name = name; }; cat.showInfo = function () { alert("name=" + this.name + ",age=" + this.age); }; return cat; } // 使用 $(function () { var cat = Cat("Tom", 1); });
2、建構函式式
// 類定義 function Dog(name, age) { this.name = name; this.age = age; this.hand = new Array("left", "right"); this.rename = function (name) { this.name = name; }; this.showInfo = function () { alert("name=" + this.name + ",age=" + this.age); }; } // 使用 $(function () { var dog = new Dog("Wu", 2); });
3、原型模式
（1）原型模式1
// 類定義
function Pig() {
}
Pig.prototype.name = "";
Pig.prototype.age = 0;
Pig.prototype.hand = new Array("left", "right");
Pig.prototype.rename = function (name) {
this.name = name;
};
Pig.prototype.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
// 使用
$(function () {
var pig = new Pig();
});（2）原型模式2
// 類定義
function Tiger(name, age) {
this.name = name;
this.age = age;
this.hand = new Array("left", "right");
}
Tiger.prototype.rename = function (name) {
this.name = name;
};
Tiger.prototype.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
// 使用
$(function () {
var tiger = new Tiger("JJ", 3);
});4、動態原型模式
// 類定義
function Duck(name, age) {
this.name = name;
this.age = age;
this.hand = new Array("left", "right");
if ("undefined" == typeof(Duck.inited)) {
Duck.prototype.rename = function (name) {
this.name = name;
};
Duck.prototype.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
Duck.inited = true;
}
}
// 使用
$(function () {
var duck = new Duck("Tang", 4);
});5、混合模式
// 類定義
function Fish() {
var fish = new Object();
fish.name = "";
fish.age = 0;
fish.hand = new Array("left", "right");
fish.rename = function (name) {
this.name = name;
};
fish.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
return fish;
}
// 使用
$(function () {
var fish = new Fish();
});6、測試用例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CLASS</title>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
</body>
<script>
$(function () {
var tom = Tom();
var cat = Cat("Tom", 1);
var dog = new Dog("Wu", 2);
var pig = new Pig();
var tiger = new Tiger("JJ", 3);
var duck = new Duck("Tang", 4);
var fish = new Fish();
});
// 工廠模式 1
function Tom() {
var tom = new Object;
tom.name = "";
tom.age = 0;
tom.hand = new Array("left", "right");
tom.rename = function (name) {
tom.name = name;
};
tom.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
return tom;
}
// 工廠模式 2
function Cat(name, age) {
var cat = new Object;
cat.name = name;
cat.age = age;
cat.hand = new Array("left", "right");
cat.rename = function (name) {
cat.name = name;
};
cat.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
return cat;
}
// 建構函式方式
function Dog(name, age) {
this.name = name;
this.age = age;
this.hand = new Array("left", "right");
this.rename = function (name) {
this.name = name;
};
this.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
}
// 原型模式 1
function Pig() {
}
Pig.prototype.name = "";
Pig.prototype.age = 0;
Pig.prototype.hand = new Array("left", "right");
Pig.prototype.rename = function (name) {
this.name = name;
};
Pig.prototype.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
// 原型模式 2
function Tiger(name, age) {
this.name = name;
this.age = age;
this.hand = new Array("left", "right");
}
Tiger.prototype.rename = function (name) {
this.name = name;
};
Tiger.prototype.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
// 動態原型
function Duck(name, age) {
this.name = name;
this.age = age;
this.hand = new Array("left", "right");
if ("undefined" == typeof(Duck.inited)) {
Duck.prototype.rename = function (name) {
this.name = name;
};
Duck.prototype.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
Duck.inited = true;
}
}
// 混合模式
function Fish() {
var fish = new Object();
fish.name = "";
fish.age = 0;
fish.hand = new Array("left", "right");
fish.rename = function (name) {
this.name = name;
};
fish.showInfo = function () {
alert("name=" + this.name + ",age=" + this.age);
};
return fish;
}
</script>
</html>