Javascript 캡슐화 휴대폰 클래스 함수 코드 예제에 대한 자세한 설명

첫 번째 단계: "휴대폰 클래스" 만들기

var MobilePhone = (function(){
　　　　…………
})()

두 번째 단계: 이 클래스와 필요한 해당 클래스의 프라이빗 속성을 고려합니다. 여기서 정의하고 싶은 것은 휴대폰 수입니다. 3단계: 생성자, 즉 인스턴스화 시 생성된 새 개체의 초기화를 만듭니다(예: 이 예에서는 속성 및 메서드 초기화). size, Price 속성도 클로저이므로 count에 접근할 수 있고 count의 값은 오랫동안 메모리에 저장됩니다(참조가 있는 한)

var MobilePhone = (function(){
 //私有属性
 var count = 0; //代表手机的数量
})()

Step 4: 일반적인 메소드:

즉, 인스턴스화되는 모든 휴대폰 객체에서 이 메소드를 사용할 수 있습니다. 여기서 휴대폰은 가격, 색상, 크기를 변경할 수 있어야 하며 크기도 표시할 수 있어야 합니다. , 색상 및 가격.

여기서 공통 메서드는 "프로토타입 개체"에 배치되어야 합니다.

1. 이 생성자에 의해 인스턴스화된 모든 개체, 즉 생성된 휴대폰은 "프로토타입 개체"의 메서드를 사용할 수 있습니다.

2. 생성자에 배치하면 휴대폰 개체가 인스턴스화될 때마다 여러 개의 반복 메서드가 생성되어 메모리를 차지합니다.

3. "constructor":creatphone 설명:

creatphone.prototype = {...}는 이전 프로토타입 개체에 대한 참조를 상당히 덮어쓰기 때문입니다. 프로토타입 객체를 생성자와 연결하기 위해 "constructor":creatphone 속성이 설정됩니다.

var MobilePhone = (function(){
 //私有属性
 var count = 0; //代表手机的数量　
 　　　　//构造函数
 　　　　var creatphone = function(color,size,price){
 　　　　　　　　count++;
 　　　　　　　　this._color = color; //手机的颜色
 　　　　　　　　this._size = size; //手机的大小
 　　　　　　　　this._price = price; //手机的价格
 　　　　　　　　this.index = count; //手机索引，是第几台创建的手机手象
 　　　　　}
})()

5단계: 권한 있는 메서드, 즉 프로토타입 개체의 개인 변수에 액세스할 수 있는 메서드가 필요합니다. 수업. 인스턴스에서 얼마나 많은 휴대폰 객체가 나오는지

var MobilePhone = (function(){
 //私有属性
 var count = 0;//代表手机的数量
　　　　//构造函数
　　　　 var creatphone = function(color,size,price){
　　　　　　　　count++;
　　　　　　　　this._color = color; //手机的颜色
　　　　　　　　this._size = size; //手机的大小
　　　　　　　　this._price = price; //手机的价格
　　　　　　　　this.index = count; //手机索引，是第几台创建的手机手象
　 　　　　}
 //公有方法，存放在原型对象中 
 creatphone.prototype = { 
　　　　　　"constructor":creatphone,
　　　　　　//获取手机颜色
  "getColor" : function(){
  return this._color; 
  },
　　　　　　//设置手机颜色
  "setColor" : function(color){
  this._color = color;
  },
　　　　　　//获取手机大小
  "getSize" : function(){
  return "width:"+this._size.width + " height:" + this._size.height; 
  },
　　　　　　//设置手机大小
  "setSize" : function(size){
  this._size.width = size.width;
  this._size.height = size.height;
  },
　　　　　　//获取手机价格
  "getPrice" : function(){
  return this._price;
  },
　　　　　　//设置手机价格
  "setPrice" : function(price){
  this._price = price
  } 
 }
})()

위에 캡슐화된 휴대폰 클래스를 사용하여 테스트

var MobilePhone = (function(){
 //私有属性
 var count = 0;//代表手机的数量
 var index = 0;//代表手机的索引
 　　　　//构造函数
 　　　　var creatphone = function(color,size,price){
 　　　　　　　　count++;
 　　　　　　　　this._color = color; //手机的颜色
 　　　　　　　　this._size = size; //手机的大小
 　　　　　　　　this._price = price; //手机的价格
 　　　　　　　　this.index = count; //手机索引，是第几台创建的手机手象
 　　　　　　}
　　　　　//公有方法，存放在原型对象中
 creatphone.prototype = {
  "constructor":creatphone,
  "getColor" : function(){
  return this._color; 
  },
  "setColor" : function(color){
  this._color = color;
  },
  "getSize" : function(){
  return "width:"+this._size.width + " height:" + this._size.height; 
  },
  "setSize" : function(size){
  this._size.width = size.width;
  this._size.height = size.height;
  },
  "getPrice" : function(){
  return this._price;
  },
  "setPrice" : function(price){
  this._price = price
  } 
 }
 //特权方法
 creatphone.get_count_index = function(){
  return count
 }
 return creatphone;
})()

위 내용은 Javascript 캡슐화 휴대폰 클래스 함수 코드 예제에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!