javascript类与对象结合理解jsUI框架
以下代码都是网上找的,便于理解与方便查找学习之用!!
构造函数方式
function Car(sColor,iDoors,iMpg){
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.showColor = function(){
alert(this.color);
}
}
var Car1 = new Car("red",4,23);
Car1.showColor();
原型方式+构造方法
function Car(name){
this.name = name;
}
Car.prototype.color ="blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.showColor = function(){
alert(this.color);
}
var Car1 = new Car();
car1.showColor();
function Person(name){
this.name = name;
}
Person.prototype={
printName:function(){
alert(this.name);
}
}
var person = new Person("kk");
person.printName();
动态原型方式----完美解决方案
function Car(sColor){
this.color = sColor;
if(Car.prototype.say =="undefined"){
Car.prototype.say = function(){
alert(this.color);
}
}
}
var Car1 = new Car("111");
Car1.say();
继承的实现方式
1、对象冒充
function Car(name){
this.name = name;
this.say = function(){
alert(this.name);
}
}
function bigCar(name){
this.inherit = Car;
this.inherit(name);
delete this.inherit;
this.color = function(){
alert("I am bigCar");
}
}
var car = new bigCar("futian");
car.say();
2、利用call()和apply()冒充
function Person(name,age){
this.name = name;
this.age = age;
this.say = function(){
alert(this.name);
}
}
function WhitePeople(name,age){
People.call(this,name,age);//call方式以多个参数进行传值
People.apply(this,[name,age]);//apply方式以数组方式进行传值
this.color=function(){
alert("i am");
}
}
var p = new WhitePeople("wang",34);
p.say();
p.color();
JS 实现 创建类、继承、方法添加、对象克隆、数组封装操作
一.对象的创建以及方法的添加
/** 1.类创建,可继承
* Parent,父类
*newparams,当前新创建类的参数集合,包括属性和方法
*/
window.Class = {
Create: function (parent,newparams) {
var NewFun=function () {
if (typeof this.initialize != 'undefined') {
this.initialize.apply(this, arguments);
}
}
if(parent!=null){
if (typeof parent == 'function') {
NewFun.prototype = new parent(Array.prototype.slice.apply(arguments, [1]));
NewFun.prototype.constructor = NewFun;
NewFun._parent = parent;
/* * 实现调用父类函数的方法
* <code>
* this.Parent('callFunction');
* </code>
* @param string name 类名
* @return function
*/ NewFun.AddMethod('Parent', function (name) {
var func = NewFun.constructor.prototype[name];
if (func == NewFun[name]) {
func = parent.prototype[name];
}
return func.apply(NewFun, Array.prototype.slice.apply(arguments, [1]));
});
}
else{
/*继承出错*/ }
}
/* 合并属性和方法 */
if (typeof newparams == 'object') {
for (var param in newparams) {
NewFun.AddMethod(param, newparams[param]);
}
}
return NewFun;
}
}
/* * 2.向类中添加方法或属性
* @param string name 函数名
* @param function func 函数主体
* @return function
*/Function.prototype.AddMethod = function (name, func) {
this.prototype[name] = func;
return this;
}
.类实例化调用示例:
/*1.先创建MyClass 类*/
var MyClass=Class.Create(null,
{
Type:"LWLChart",
Value:13,
show:function(){
alert(this.Value);
},
hiden:function(){
alert("隐藏");
}
}
);
/*2.新类 CMyExtClass 继承自 MyClass,并新增属性和方法*/
var CMyExtClass = Class.Create(MyClass,
{
Name:"LWL",
Age:22,
show:function(){
alert(this.Type);
},
ShowAg:function(){
alert(this.Age);
}
}
);
/*3.实例化 类CMyExtClass ,并调用相应方法、属性赋值*/
var newclass=new CMyExtClass();
newclass.show();
newclass.hiden();
newclass.Age=newclass.Age-1;
newclass.ShowAg();
二.对象克隆
/*3.克隆
*clone:克隆方法,未实现
*cloneObject:克隆对象 o:需要克隆的对象 */
var CCloneable = Class.Create(null,{
/* * 复制类
* @return object
*/ clone : function () {
return null;
},
cloneObject:function (o) {
if (o instanceof CCloneable) {
// 如果继承自CCloneable则执行自身的考虑操作
return o.clone();
}
var type = typeof(o);
switch (type) {
case 'undefined' :
case 'boolean' :
case 'string' :
case 'number' : return o;
case 'function' : return o;
case 'object' :
if (o == null) {
return null;
}
if (o instanceof Date) {
return new Date(o.getTime());
}
if (o instanceof Number) {
return new Number(o.valueOf());
}
if (o instanceof Boolean) {
return new Boolean(o.valueOf());
}
if (o instanceof Error) {
return new Error(o.number, o.message);
}
if (o instanceof Array) {
return o.concat([]);
}
if (o instanceof Object) {
var oo = {};
for (var k in o) {
oo[k] = o[k];
}
return oo;
}
default : break;
}
return null;
}
});
三.数组封装,添加、移除、查找、克隆方法实现
/*4.数组操作,包括:
*1.初始化 initialize()
*2.输出数组,toArray()
*3.获得元素所处的位置,indexOf(o)
*4.获得元素在数组中最后的位置,lastIndexOf(o)
*5.添加元素,add
*6.添加多个元素,addAll
*7.移除元素,removeAt(i),i:需要移除的元素索引值
*8.移除元素,remove(o),o:需要移除的元素值
*9.判断元素是否存在,contains(o)
*10.清除链表,clear
*11.当前数组元素个数,size
*12.根据索引获得相应元素,get(i)
*13.对相应索引位置的元素进行赋值,set(i,o)
*14.复制当前数组对象并返回,clone
* */
var CArrayList = Class.Create(CCloneable,{
/* 内置数组 */ array : [],
/* * 构造函数
*/ initialize : function () {
this.array = [];
},
/* * 输出数组
* @return Array
*/ toArray : function () {
return this.array;
},
/* * 从前面获得对象所在数组位置
* @param object o 要寻找的对象
* @return int
*/ indexOf : function (o) {
var len = this.array.length;
for (var i = 0; i < len; i++) {
if (this.array[i] == o) {
return i;
}
}
return -1;
},
/* * 从后面获得对象所在数组位置
* @param object o 要寻找的对象
* @rerturn int
*/ lastIndexOf : function (o) {
var len = this.array.length;
for (var i = len; i >= 0; i--) {
if (this.array[i] == o) {
return i;
}
}
return -1;
},
/* * 添加元素
* @param object arg1 被插入的对象
* @param object arg2 插入的对象
*/ add : function (arg1, arg2) {
if (arguments.length == 1) {
// 如果参数为1则直接在链表末尾插入对象
var len = this.array.length;
this.array[len] = arg1;
} else {
// 插入对象
var len1 = this.array.length;
var a1 = this.array.slice(0, arg1);
var a2 = this.array.slice(arg1, len);
var len2 = a1.length;
a1[len2] = arg2;
this.array = a1.concat(a2);
}
},
/* * 添加多个元素
* @param Array a 元素数组
*/ addAll : function (a) {
if (a instanceof Array) {
// 添加的元素是数组
this.array = this.array.concat(a);
} else if (typeof(a.toArray) == 'function'
&& ((a = a.toArray()) instanceof Array)) {
// 添加的元素是链表
this.array = this.array.concat(a);
} else {
throw new CException('参数错误', '添加链表的时候参数出错');
}
},
/* * 移除元素
* @param int i 索引值
*/ removeAt : function (i) {
var len = this.array.length;
if (i < 0 || i >= len) {
return null;
}
var o = this.array[i];
this.array = this.array.slice(0, i).concat(this.array.slice(i + 1, len));
return o;
},
/* * 移除元素
* @param object o 元素
*/ remove : function (o) {
var i = this.indexOf(o);
if (i == -1) {
return this;
}
return this.removeAt(i);
},
/* * 验证元素是否存在
* @return boolean
*/ contains : function (o) {
return this.indexOf(o) != -1;
},
/* * 清除链表
*/ clear : function () {
this.array.length = 0;
},
/* * 获得链表大小
* @return int
*/ size : function () {
return this.array.length;
},
/* * 获得元素
* @param int i 索引值
* @return object
*/ get : function (i) {
var size = this.size();
if (i >= 0 && i < size) {
return this.array[i];
} else {
return null;
}
},
/* * 设置元素
* @param int i 索引值
* @param ojbect 元素
*/ set : function (i, o) {
var size = this.size();
if (i >= 0 && i < size) {
this.array[i] = o;
}
},
/* * 复制链表(重构)
*/ clone : function () {
var o = new CArrayList();
o.addAll(this.array);
return o;
}
});
数组对象实例化,使用
var NewArray=new CArrayList();
NewArray.add(12);
NewArray.addAll([24,35,11,20,15]);
NewArray.remove(24);
NewArray.removeAt(0);
来源:http://www.verydemo.com/demo_c98_i2658.html
javascript种与对象结合理解jsUI框架
javascript类与对象结合理解jsUI框架以下代码都是网上找的,便于理解与方便查找学习之用!!构造函数方式func
