这些小活动你都参加了吗?快来围观一下吧!>>
电子产品世界 » 论坛首页 » 综合技术 » 基础知识 » JS面向对象代码

共2条 1/1 1 跳转至

JS面向对象代码

菜鸟
2020-12-15 16:07:27     打赏

不管学习哪门开发语言,总的目的都是为了用代码变现出来,今天就直接贴一段js面向对象的代码,供大家学习。

<scripttype="text/javascript">

//创建箱子类

functionBox(option){

varself=this;

var_option={

height:12,

width:12

};

//合并参数对象:记得引用Jquery.js

$.extend(_option,option);

this.height=_option.height;

this.width=_option.height;

//绑定事件列表

var_events={};

//创建一个方法,并带有回调函数

this.push=function(option,callback){

if(option.height>this.height){

console.error("overheight",this);

return;

}

if(option.width>this.width){

console.error("overwidth",this);

return;

}

//判断是否有回调函数

if(callbackinstanceofFunction)

//调用回调函数,并给它传值(参数:_option)

callback.call(this,_option);

}

//绑定事件

this.on=function(name,event){

if(name==null||!name)

returnnull;

if(!(eventinstanceofFunction))

if(self[name]instanceofFunction){

returnself[name]();

}

if(eventinstanceofFunction)

_events[name]=self[name]=function(){

event.apply(this);

returnthis;

}

}

//解除绑定事件

this.unbind=function(name){

deleteself[name];

delete_events[name];

//链式表达式

returnthis;

}

}

//创建box1对象

varbox1=newBox();

//创建box2对象

varbox2=newBox();

//调用方法

box1.push({

height:12,

width:12

//回调函数

},function(option){

console.log("push回调函数已调用..",option);

});

//动态给对象绑定事件

box1.on("click",function(){

this.width+=10;

console.log("width递增10,click事件被调用..",this.width);

});

box1.on("heihei",function(){

console.log("heihei事件被调用..",this.width);

});

//事件普通调用

box1.click();

//链式表达式调用方法

box1.on("click").click().heihei().on("heihei");

//打印box1的宽度

console.log(box1.width);

//打印box2的宽度

console.log(box2.width);

//解除绑定事件

box1.unbind("heihei");

//测试解除

box1.heihei();

</scrip

以上就是JS面向对象代码的详细分析,通过以上代码的学习,是否对Java编程的学习更加感兴趣了呢?我们不仅有Java编程学习的培训,还有其他十几种编程语言,线上线下相结合的方式进行授课学习,课堂随堂指导,课后项目老师辅导学习,手把手的教学方式,你还在等什么呢?赶快加入扣丁学堂java技术交流群:487098661。微 信 号:codingbb



高工
2020-12-15 21:14:46     打赏
2楼

代码写的非常好


共2条 1/1 1 跳转至

回复

匿名不能发帖!请先 [ 登陆 注册 ]