JavaScript의 기능에 대한 깊은 이해

함수는 모듈식 프로그래밍의 기초입니다. 복잡한 Ajax 애플리케이션을 작성하려면 함수에 대해 더 깊이 이해해야 합니다. JavaScript의 함수는 다른 언어와 다릅니다. 각 함수는 객체로 유지되고 실행됩니다. 함수 객체의 속성을 통해 함수를 변수에 쉽게 할당하거나 함수를 매개변수로 전달할 수 있습니다. 계속하기 전에 함수 사용 구문을 살펴보겠습니다.

function func1(…){…}
var func2=function(…){…};
var func3=function func4 ( …){…};
var func5=new Function();
　이것은 함수 선언을 위한 올바른 구문입니다. 다른 언어에서 흔히 사용하는 함수나 이전에 소개했던 함수 정의 방식과는 많이 다릅니다. 그렇다면 JavaScript에서는 왜 이렇게 작성할 수 있을까요? 따르는 구문은 무엇입니까? 자세한 내용은 아래에 설명되어 있습니다.

함수 객체 이해

function 키워드를 사용하여 함수를 정의하고, 각 함수에 함수 이름을 지정하고, 함수 이름을 통해 호출할 수 있습니다. JavaScript가 해석되고 실행될 때 함수는 도입되는 Function Object인 객체로 유지됩니다.

함수 객체는 다른 사용자 정의 객체와 본질적으로 다릅니다. 이러한 유형의 객체를 날짜 객체(Date), 배열 객체(Array), 문자열 객체(String All)라고 합니다. 내부 개체입니다. 이러한 내장 객체의 생성자는 JavaScript 자체에 의해 정의됩니다. 객체를 반환하기 위해 new Array()와 같은 문을 실행함으로써 JavaScript는 사용자가 객체 구성 방법을 지정하는 대신 반환된 객체를 초기화하는 내부 메커니즘을 갖습니다. .

JavaScript에서는 해당 유형의 함수 객체가 Function이고, 해당 유형의 배열 객체가 Array이고 해당 유형의 날짜 객체가 Date인 것처럼 new Function()을 통해 함수 객체를 생성할 수 있습니다. 또는 function 키워드를 통해 객체를 생성할 수 있습니다. 이해를 돕기 위해 함수 객체 생성과 배열 객체 생성을 비교합니다. 먼저 배열 객체를 살펴보겠습니다. 다음 두 줄의 코드는 모두 배열 객체 myArray를 생성합니다.

var myArray=[];
//
var myArray=new Array()와 동일합니다. ;
마찬가지로 다음 두 코드도 myFunction 함수를 생성합니다.
function myFunction(a,b){
return a+b;
}
// var myFunction=new Function("a","b","return a+b");
배열 객체를 구성하는 구문과 비교해보면 함수 객체의 본질을 확실히 알 수 있습니다. 앞서 소개한 함수 선언은 위와 같습니다. 코드의 첫 번째 방식은 인터프리터 내에서 이 구문을 만나면 자동으로 Function 객체가 생성되고 함수가 내부 객체로 저장되어 실행됩니다. 여기서도 알 수 있듯이 함수객체명(함수변수)과 일반 변수명은 동일한 사양을 가지고 있으며 둘 다 변수명을 통해 변수를 참조할 수 있으나 함수변수명 뒤에는 괄호와 매개변수가 올 수 있다. 기능을 수행하기 위한 목록입니다.

함수 본문에는 일반적으로 여러 개의 명령문이 문자열 형식으로 매개변수로 전달되면 코드의 가독성이 떨어지기 때문에 new Function() 형식으로 함수를 생성하는 것은 일반적이지 않습니다. 가난할 것이다. 다음은 사용 구문을 소개합니다.

var funcName=new Function(p1,p2,,pn,body);

매개변수 유형은 모두 문자열이며, p1~pn은 생성된 매개변수 이름을 나타냅니다. function List, body는 생성된 함수의 function body 문을 나타내며, funcName은 생성된 함수의 이름입니다. 매개변수를 지정하지 않고 빈 함수를 생성할 수 있고, funcName을 지정하지 않고 이름 없는 함수를 생성할 수 있습니다. 물론 이러한 함수는 의미가 없습니다.

p1 ~ pn은 매개변수 이름 목록입니다. 즉, p1은 매개변수를 나타낼 수 있을 뿐만 아니라 쉼표로 구분된 매개변수 목록일 수도 있습니다. 예를 들어 다음 정의는 동일합니다. :

new Function("a", "b", "c", "return a+b+c")

new Function("a, b, c", "return a+b +c" ")
new Function("a,b", "c", "return a+b+c")
JavaScript는 Function 유형을 도입하고 new Function()과 같은 구문을 제공합니다. 속성을 추가하고 메소드는 함수 유형에 의존해야 합니다.
함수의 본질은 내부 개체이며 JavaScript 인터프리터가 함수의 작동 방식을 결정합니다. 위 코드로 생성된 함수는 프로그램 내 함수명을 이용하여 호출할 수 있습니다. 이 섹션의 시작 부분에 나열된 함수 정의 문제도 설명됩니다. 함수 선언 바로 뒤에 괄호를 추가하여 함수가 생성 직후에 호출된다는 것을 나타낼 수 있습니다. 예를 들면 다음과 같습니다.

var i=function (a,b){

return a+b;
} (1,2);
alert(i);
이 코드는 변수 i의 값이 3과 같다고 표시합니다. i는 생성된 함수가 아니라 반환된 값을 나타냅니다. 괄호 "("가 등호 "="보다 우선순위가 높기 때문입니다. 이러한 코드는 일반적으로 사용되지 않을 수 있지만 사용자가 원하는 경우에 사용됩니다. 이는 모듈식에 적합한 솔루션입니다.

다음 두 가지 기능 생성 방법은 동일하지만 유의해야 합니다.

function funcName(){
//함수 본문
}
//
var funcName=function(){
//함수 본문
}
과 동일 그러나 전자의 방법은 명명된 함수를 생성하고 후자의 방법은 명명되지 않은 함수를 생성하여 변수가 명명되지 않은 함수를 가리키도록 합니다. 사용법에는 한 가지 차이점이 있습니다. 명명된 함수의 경우 호출된 후에 정의할 수 있지만 명명되지 않은 함수의 경우 호출하기 전에 정의해야 합니다. 예:

이 명령문은 func에 대해 정의되지 않은 오류를 생성하며

가 올바르게 실행될 수 있으며, 다음 명령문도 올바르게 실행될 수 있습니다:

JavaScript는 해석형 언어이지만 함수 호출 시 전체 코드에 해당 함수 정의가 있는지 확인하는 것을 볼 수 있습니다. 이 함수 이름은 function funcName( ) 유효하며 익명 함수일 수 없습니다.

함수 개체와 기타 내부 개체의 관계

함수 개체 외에도 Object, Array, Date, RegExp, Math, Error와 같은 많은 내부 개체가 있습니다. 이러한 이름은 실제로 유형을 나타내며 객체는 new 연산자를 통해 반환될 수 있습니다. 그러나 함수 객체는 다른 객체와 다릅니다. typeof를 사용하여 함수 객체의 유형을 가져오면 여전히 "function" 문자열을 반환하고, 배열 객체나 다른 객체의 typeof를 사용하면 "object" 문자열을 반환합니다. ". 다음 코드는 다양한 유형의 typeof를 보여줍니다.

alert(typeof(Function)));
alert(typeof(new Function()));
alert( typeof(Array));
alert(typeof(Object));
alert(typeof(new Array()));
alert(typeof(new Date()));
alert( typeof(new Object()));
이 코드를 실행하면 처음 4개의 문에는 "function"이 표시되고 다음 3개의 문에는 "object"가 표시되는 것을 볼 수 있습니다. 함수는 실제로 함수를 반환합니다. 이것은 다른 개체와 매우 다릅니다. Array 및 Object와 같은 다른 유형은 new 연산자를 통해 일반 객체를 반환합니다. 함수 자체도 객체이지만 객체 생성자이기도 하다는 점에서 여전히 일반 객체와 다릅니다. 즉, 이전에 소개한 객체를 반환하는 새로운 함수를 만들 수 있습니다. typeof가 "function"을 반환하는 모든 객체는 함수 객체입니다. 이러한 객체를 생성자라고도 합니다. 따라서 모든 생성자는 객체이지만 모든 객체가 생성자는 아닙니다.

함수 자체도 객체이기 때문에 C++, Java 등 객체지향 언어의 클래스 정의를 생각해보면 Function 유형의 역할, 즉 함수를 짐작할 수 있습니다. , 함수 객체 자체에 대한 일부 함수를 정의할 수 있습니다. 함수의 프로토타입 객체를 사용하면 함수 유형 정의를 쉽게 수정하고 확장할 수 있습니다. 여기에 method1 메소드가 추가되었습니다. 이 기능은 "function"을 표시하는 대화 상자를 표시하는 것입니다:

Function.prototype.method1=function(){
Alert("function");
}
function func1(a,b,c){
return a+b+c ;
}
func1.method1();
func1.method1.method1();
함수 개체 method1 메서드의 method1을 호출하는 마지막 문인 func1.method1.mehotd1()에 유의하세요. 다소 혼란스러워 보이지만 구문을 자세히 살펴보면 이것이 재귀적 정의라는 사실이 분명해집니다. method1 자체도 함수이기 때문에 함수 개체의 속성과 메서드도 갖습니다. Function 유형에 대한 모든 메서드 확장에는 이러한 재귀 속성이 있습니다.

Function은 모든 함수 객체의 기초이고, Object는 모든 객체(함수 객체 포함)의 기초입니다. JavaScript에서는 모든 개체가 Object의 인스턴스입니다. 따라서 모든 개체가 공통 속성과 메서드를 갖도록 개체 유형을 수정할 수 있습니다.

Object .prototype.getType =function(){
return typeof(this);
}
var array1=new Array();
function func1(a,b){
return a+ b;
}
alert(array1.getType());
alert(func1.getType());
위 코드는 모든 객체에 getType 메소드를 추가하여 객체 유형을 반환합니다. 두 개의 경고 문에는 각각 "개체"와 "함수"가 표시됩니다.

함수를 매개변수로 전달

함수 객체의 본질은 앞에서 소개한 바 있습니다. 각 함수는 특수한 객체로 표현되어 쉽게 변수에 할당될 수 있으며, 이 변수 ​​이름을 통해 함수 호출이 이루어집니다. 변수로서 매개변수 형태로 다른 함수에 전달될 수 있습니다. 이는 JavaScript 이벤트 처리 메커니즘에 대한 이전 소개에서 확인되었습니다. 예를 들어 다음 프로그램은 func1을 func2에 매개변수로 전달합니다.

function func1(theFunc){

theFunc();
}
function func2(){
Alert("ok");
}
func1(func2);
마지막 명령문에서 func2는 func1의 형식 매개변수 theFunc에 객체로 전달된 후 func1에 의해 내부적으로 theFunc가 호출됩니다. 실제로 함수를 매개변수로 전달하거나 다른 변수에 함수를 할당하는 것은 모든 이벤트 메커니즘의 기초입니다.

예를 들어 페이지가 로드될 때 일부 초기화 작업을 수행해야 하는 경우 먼저 init 초기화 함수를 정의한 다음 window.onload=init를 통해 페이지 로드 완료 이벤트에 바인딩할 수 있습니다. 성명. 여기서 init는 창의 onload 이벤트 목록에 추가할 수 있는 함수 개체입니다.

이상은 JavaScript의 기능에 대한 심층적인 이해 내용입니다. 더 많은 관련 글은 PHP 중국어 홈페이지(www.php.cn)를 참고해주세요!