扣丁学堂Java培训之JS面向对象代码分享

不管学习哪门开发语言，总的目的都是为了用代码变现出来，今天就直接贴一段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