JS 디자인 모드(6가지 유형)
1. 구조 함수 모드: 새 대상을 되돌려줍니다
constructor new를 통해 실현function Person(name,age){
this.name = name;
this.age = age;
}
Person.prototype.sayName = function(){
return this.name;
}
var student = new Person("YQY",22);
2. 플랜트 모드: 새 객체 반환
factory function createPerson(name){
var person= {
name: name,
sayName:function(){
console.log(this.name);
}
};
return person;
}
//
createPerson("YQY").sayName() // YQY
createPerson("xiaoming").sayName() //xiaoming
//
var t = createPerson("YQY").sayName()
t() //undefined
// createPerson sayName this window
3. 단일 모드
singleton var People = (function(){
var instance;
function init(name){
return{
name: name
};
}
return{
createPeople : function(name){
if(!instance){
instance = init(name);
}
return instance
}
}
}());
People.createPeople("YQY") //{"name" :"YQY"}
People.createPeople("xiaoming") //{"name" :"YQY"}
4. 블렌드 모드
mix in 상속var Person = function(name,age){
this.name = name;
this.age = age;
}
Person.prototype.sayName = function(){
console.log(this.name);
}
var Student = function(name,age,score){
Person.call(this,name,age);
this.score = score;
};
//Student.prototype = Object.create(Person.prototype)
Student.prototype = create(Person.prototype);
function create(parentObj){
function F(){}
F.prototype = parentObj;
return new F();
};
Student.prototype.sayScore = function(){
console.log(this.score);
}
var student = new Student("YQY",22,95);
5. 모듈 모드: 클립을 통해 하나의 모듈을 실현
module var Person = (function(){
var name = "YQY";
function sayName(){
console.log(name);
}
return {
name:name,
sayName:sayName
}
})()
Person //{name:name,sayName:sayName}
6. 게시 모드에 가입
publish/subscribe var EventCenter = (function(){
var events = {};
function on(evt,handler){
events[evt] = events[evt] || [];
events[evt].push({
handler:handler
});
}
function fire(evt,args){
if(!events[evt]){
return;
}
for(var i = 0; i < events[evt].length; i++){
events[evt][i].handler(args);
}
}
function off(name){
delete events[name]
}
return{
on:on,
off:off,
fire:fire
}
})();
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSON
JSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다.
그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다.
저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
function Person(name,age){
this.name = name;
this.age = age;
}
Person.prototype.sayName = function(){
return this.name;
}
var student = new Person("YQY",22);
factory
function createPerson(name){
var person= {
name: name,
sayName:function(){
console.log(this.name);
}
};
return person;
}
//
createPerson("YQY").sayName() // YQY
createPerson("xiaoming").sayName() //xiaoming
//
var t = createPerson("YQY").sayName()
t() //undefined
// createPerson sayName this window
3. 단일 모드
singleton var People = (function(){
var instance;
function init(name){
return{
name: name
};
}
return{
createPeople : function(name){
if(!instance){
instance = init(name);
}
return instance
}
}
}());
People.createPeople("YQY") //{"name" :"YQY"}
People.createPeople("xiaoming") //{"name" :"YQY"}
4. 블렌드 모드
mix in 상속var Person = function(name,age){
this.name = name;
this.age = age;
}
Person.prototype.sayName = function(){
console.log(this.name);
}
var Student = function(name,age,score){
Person.call(this,name,age);
this.score = score;
};
//Student.prototype = Object.create(Person.prototype)
Student.prototype = create(Person.prototype);
function create(parentObj){
function F(){}
F.prototype = parentObj;
return new F();
};
Student.prototype.sayScore = function(){
console.log(this.score);
}
var student = new Student("YQY",22,95);
5. 모듈 모드: 클립을 통해 하나의 모듈을 실현
module var Person = (function(){
var name = "YQY";
function sayName(){
console.log(name);
}
return {
name:name,
sayName:sayName
}
})()
Person //{name:name,sayName:sayName}
6. 게시 모드에 가입
publish/subscribe var EventCenter = (function(){
var events = {};
function on(evt,handler){
events[evt] = events[evt] || [];
events[evt].push({
handler:handler
});
}
function fire(evt,args){
if(!events[evt]){
return;
}
for(var i = 0; i < events[evt].length; i++){
events[evt][i].handler(args);
}
}
function off(name){
delete events[name]
}
return{
on:on,
off:off,
fire:fire
}
})();
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSON
JSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다.
그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다.
저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
var People = (function(){
var instance;
function init(name){
return{
name: name
};
}
return{
createPeople : function(name){
if(!instance){
instance = init(name);
}
return instance
}
}
}());
People.createPeople("YQY") //{"name" :"YQY"}
People.createPeople("xiaoming") //{"name" :"YQY"}
mix in 상속
var Person = function(name,age){
this.name = name;
this.age = age;
}
Person.prototype.sayName = function(){
console.log(this.name);
}
var Student = function(name,age,score){
Person.call(this,name,age);
this.score = score;
};
//Student.prototype = Object.create(Person.prototype)
Student.prototype = create(Person.prototype);
function create(parentObj){
function F(){}
F.prototype = parentObj;
return new F();
};
Student.prototype.sayScore = function(){
console.log(this.score);
}
var student = new Student("YQY",22,95);
5. 모듈 모드: 클립을 통해 하나의 모듈을 실현
module var Person = (function(){
var name = "YQY";
function sayName(){
console.log(name);
}
return {
name:name,
sayName:sayName
}
})()
Person //{name:name,sayName:sayName}
6. 게시 모드에 가입
publish/subscribe var EventCenter = (function(){
var events = {};
function on(evt,handler){
events[evt] = events[evt] || [];
events[evt].push({
handler:handler
});
}
function fire(evt,args){
if(!events[evt]){
return;
}
for(var i = 0; i < events[evt].length; i++){
events[evt][i].handler(args);
}
}
function off(name){
delete events[name]
}
return{
on:on,
off:off,
fire:fire
}
})();
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSON
JSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다.
그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다.
저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
var Person = (function(){
var name = "YQY";
function sayName(){
console.log(name);
}
return {
name:name,
sayName:sayName
}
})()
Person //{name:name,sayName:sayName}
publish/subscribe
var EventCenter = (function(){
var events = {};
function on(evt,handler){
events[evt] = events[evt] || [];
events[evt].push({
handler:handler
});
}
function fire(evt,args){
if(!events[evt]){
return;
}
for(var i = 0; i < events[evt].length; i++){
events[evt][i].handler(args);
}
}
function off(name){
delete events[name]
}
return{
on:on,
off:off,
fire:fire
}
})();
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.