js面向對象編程的示例分析

小編給大家分享一下js面向對象編程的示例分析，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

//定義Circle類，擁有成員變量r，常量PI和計算面積的成員函數area()

1.工廠方式

var Circle = function() {
 var obj = new Object();
 obj.PI = 3.14159;
 obj.area = function( r ) {
  return this.PI * r * r;
 }
 return obj;
}
var c = new Circle();
alert( c.area( 1.0 ) );

2.比較正規的寫法

function Circle(r) {
  this.r = r;
}
Circle.PI = 3.14159;
Circle.prototype.area = function() {
 return Circle.PI * this.r * this.r;
}
var c = new Circle(1.0); 
alert(c.area());

3.json寫法

var Circle={
 "PI":3.14159,
 "area":function(r){
   return this.PI * r * r;
  }
};
alert( Circle.area(1.0) );

4.有點變化，但是實質和第一種一樣

var Circle=function(r){
  this.r=r;
}
Circle.PI = 3.14159; 
Circle.prototype={
 area:function(){
  return this.r*this.r*Circle.PI;
 }
}
var obj=new Circle(1.0);
alert(obj.area())

Circle.PI = 3.14159; 能夠放入屬性中寫成this.PI=3.14159;

常用為第一種和第三種

第三種寫法的擴展小實例

var show={
  btn:$('.div1'),
  init:function(){
   var that=this;
   alert(this);
   this.btn.click(function(){
     that.change();
     alert(this);
    })
  },
  change:function(){
   this.btn.css({'background':'green'});
  }
 }
 show.init();

以上是“js面向對象編程的示例分析”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！