JS 객체지향, 프로토타입, call(), apply()

그날 프로토타입.js를 사용해서 열어서 살펴보니 js의 객체지향적 성격이 잘 익숙하지 않아서 헷갈려서 바이두에서 검색해 봤습니다. 그리고 구글.드디어 조금 얻었습니다. 기억하세요^_^.

1. 원인
그날 프로토타입.js를 사용해서 열어서 살펴봤는데, 그 이유는 제가 js의 객체지향적 성격을 잘 알지 못해서였거든요. , 그래서 바이두+구글로 검색하다가 드디어 적었던 일이 있다면 기념으로 글을 남깁니다^_^.

prototype.js 코드 조각

var Class = { 
create: function() { 
return function() { 
this.initialize.apply(this , arguments); 
} 
} 
} 
// Class使用方法如下 
var A = Class.create(); 
A. prototype={ 
initialize:function(v){ 
this .value=v; 
} 
showValue:function(){ 
alert(this.value); 
} 
} 
var a = new A(‘helloWord!'); 
a. showValue();//弹出对话框helloWord！

l 초기화란 무엇인가요?
l 적용 메소드는 무엇을 하나요?
largument 변수는 어떻습니까?
l 새로운 A 이후에 초기화 메소드가 실행되는 이유는 무엇입니까?

답 찾기:

2. Js 객체 지향
초기화란 무엇입니까?
클래스의 생성자로 사용되는 메소드를 나타내는 변수입니다.
특정 기능은 js의 객체 지향 지원에 의존하는데, 객체 지향 js는 어떤 모습인가요? Java와의 유사점과 차이점은 무엇입니까?
코드를 보세요:

var ClassName = function(v){ 
this.value=v; 
this.getValue=function(){ 
return this.value; 
} 
this.setValue=function(v){ 
this.value=v; 
} 
}

그럼 JS에서 함수와 클래스의 차이점은 무엇인가요?

실제로는 동일합니다. ClassName은 new 다음에 나타날 때 객체를 구성하는 생성자로 사용됩니다.
예를 들어

var objectName1 = new ClassName(“a”);//得到一个对象

여기서 objectName1은 ClassName 생성자를 실행한 후 얻은 객체이고 ClassName 함수에서 이것은 new 이후에 생성된 객체를 참조하므로 objectName1에는 하나의 속성과 두 개의 메서드가 있습니다. 다음과 같이 호출할 수 있습니다.

objectName1.setValue(''hello''); 
alert(objectName1.getValue());//对话框hello 
alert(objectName1.value) ;//对话框hello

그래서

var objectName2 = ClassName(“b”);//得到一个对象

objectName2는 무엇을 얻나요? 분명히 이는 메소드의 반환 값입니다. 여기서 ClassName은 일반 함수로 사용됩니다(첫 글자는 대문자로 표시됨). 하지만 이전에 작성한 ClassName에는 반환 값이 없으므로 objectName2는 확인되지 않습니다. 그렇다면 "b"는 누구에게 할당됩니까? 여기서는 객체가 생성되지 않지만 이 메소드는 단순히 실행되므로 이 메소드를 호출하는 객체 창에 이 "b"가 할당됩니다.

var objectName2 = ClassName(“b”);//得到一个对象 
alert(window.value)；//对话框b

그래서 JS의 모든 기능은 동일하지만 용도는 다를 수 있습니다(객체를 구성하거나 프로시저를 수행하는 데 사용됨).

초기화는 무엇을 하는지 주제로 돌아갈 시간입니다.

var Class = { 
create: function() { 
return function() { 
this.initialize.apply(this , arguments); 
} 
} 
} 
var A = Class.create();

이 코드는 함수를 생성하여 A에 복사합니다. 이 함수는

function() { 
this.initialize.apply(this , arguments); 
}

이고 후자의 메서드가 생성자로 사용됩니다. 이 생성자를 사용하여 객체를 생성할 때 생성된 객체의 초기화 변수는 apply() 메서드를 실행합니다. apply()의 목적은 나중에 설명하고 초기화에 대해서는 계속 설명하겠습니다. 이런 식으로 객체를 초기화할 때 초기화가 접촉됩니다(접속 방법은 적용에 따라 다름).
그럼

A.prototype={ 
initialize:function(v){ 
this .value=v; 
} 
showValue:function(){ 
alert(this.value); 
} 
}

은 무슨 뜻인가요?

프로토타입은 "프로토타입"을 의미합니다. A는 함수()이고, A. 프로토타입은 실제로 객체인 함수의 변수입니다. 이 객체에는 어떤 메소드가 있고, 함수에 의해 생성된 객체에는 어떤 메소드가 있습니까? 그래서

var a = new A(‘helloWord!'); 
a. showValue();//弹出对话框helloWord！

그러면 a 객체에도 초기화 메소드가 있을 것입니다. 뿐만 아니라 A로 구성된 모든 객체에는 초기화 메소드가 있으며, 앞에서 언급한 대로 생성자는 생성 중에 호출되며 생성자는 초기화에 적용 메서드를 호출하도록 요청하므로 new A('helloWord!')가 발생하면 초기화는 적용 메서드를 호출하기 위해 다시 돌아갑니다. 초기화 메소드를 호출하는 것입니다.

3. call() 및 apply()

call() 및 apply()의 기능을 이해하기 위해 인터넷에서 몇 가지 정보를 찾아 제가 조사한 내용과 결합해 보겠습니다. function().call(object,{},{}...) 또는 function().apply (object,[...])의 기능은 기본적으로 동일합니다. () 여기서 차이점은 호출 매개변수가 두 번째 매개변수부터 funciton으로 전달되며 ","로 구분하여 순서대로 나열할 수 있다는 것입니다. Apply에는 두 개의 매개변수만 있습니다. 두 번째 매개변수는 함수에 전달된 모든 매개변수를 저장하는 배열입니다.

this.initialize.apply(this, 인수) 무슨 뜻인가요?

여기서 첫 번째 this는 이전 a인 new로 생성자를 호출한 후 생성된 개체를 참조하므로 두 번째 this도 동일한 개체를 참조해야 합니다. 그러면 이 문장은 this(즉, a)가 초기화 메소드를 호출하고 매개변수가 인수 객체(매개변수의 배열 객체)이므로 생성자가 실행되면 객체 a는 초기화 메소드를 실행하여 초기화한다는 것입니다. "초기화"라는 단어와 일치한다는 것은 옳은 것을 의미합니다.

그렇다면 초기화 메소드를 실행하기 위한 매개변수는 어떻게 전달되나요?

4. 인수 개체

이 코드는 모든 것을 설명할 수 있습니다.

function test(){ 
alert(typeof arguments); 
for(var i=0; i<arguments.length; i++){ 
alert(arguments[i]); 
} 
} 
test("1","2","3"); 
test("a","b");

실행 후, Alert(typeof 인수)는 개체를 표시하여 인수가 개체임을 나타냅니다. 그러면 1, 2, 3이 순서대로 재생됩니다. 설명 인수는 호출 함수의 실제 매개변수 그룹입니다.

var Class = { 
create: function() { 
return function() { 
this.initialize.apply(this , arguments); 
} 
} 
}

arguments 就是create返回的构造函数的实参数组，那么在 var a = new A(‘helloWord!'); 的时候‘helloWord!'就是实参数组（虽然只有一个字符串），传递给方法apply，然后在调用initialize 的时候作为参数传递给初始化函数initialize。 

以上就是本章的全部内容，更多相关教程请访问JavaScript视频教程！

위 내용은 JS 객체지향, 프로토타입, call(), apply()의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!