1. 변수
자바스크립트 변수에 저장할 수 있는 값에는 원래 값과 참조 값 두 가지가 있습니다.
원래 값은 스택의 단순 필드에 저장됩니다. 즉, 변수가 지정한 위치에 값이 직접 저장됩니다.
참조 값은 힙의 객체에 저장되고, 스택 변수는 힙의 객체를 가리키는 포인터 값을 저장합니다.
자바스크립트에는 정의되지 않음, Null, 부울, 숫자, 문자열의 5가지 기본 유형이 있습니다.
참조 유형은 실제로 다른 언어의 클래스 인스턴스 개념과 유사한 객체입니다.
var b = true; 스택
var num = 20; //스택에 저장됨
var b = new Boolen(true); //힙에 저장됨
var num = new Number(20); 힙
객체를 생성하는 일반적인 방법:
new type name var obj = new object()
매개변수가 없으면 var obj = new로 쓸 수도 있습니다. object;
객체 리터럴을 사용할 수도 있습니다. 수량 생성 object var obj = {}
2. 함수
JavaScript에서 함수는 JavaScript의 다른 객체처럼 취급되어야 합니다. 각 함수에는 암시적으로 연결된 두 개의 추가 매개변수인 인수가 있습니다.
함수는 변수에 할당되거나, 다른 객체의 속성으로 사용되거나, 다른 함수의 매개변수로 사용되거나, 반환 값으로 사용되거나, 리터럴을 사용하여 함수를 생성할 수도 있습니다.
함수 컨텍스트:
객체 지향 언어에서는 this 키워드를 사용하여 클래스 객체의 현재 인스턴스를 참조합니다. JavaScript의 this 키워드는 객체 지향 언어의 this 키워드와 다릅니다. JavaScript에서 함수는 객체이며, 이는 현재 함수가 호출되는 함수 컨텍스트를 나타냅니다.
call() 및 apply() 메서드를 통해 함수 컨텍스트를 명시적으로 지정할 수 있습니다. Call의 첫 번째 매개변수는 호출 함수의 컨텍스트로 사용되며, 다른 매개변수는 호출된 함수의 매개변수로 호출된 함수에 전달됩니다. Apply()는 두 번째 매개변수가 배열이라는 점을 제외하면 Call()과 유사합니다.
var obj = {
m: "hello"
}
var m="hi";
var say=function()
{
alert(this.m); //이것은 컨텍스트를 호출하는 함수를 가리킵니다
}
say();//안녕하세요, window는 호출 컨텍스트입니다
say.call(obj);// 안녕하세요, obj는 현재 컨텍스트를 호출하는 함수입니다
say.call(window );// 안녕하세요, window is Calling context
범위:
함수에 정의된 매개변수와 변수는 함수 외부에서 볼 수 없으며, 함수의 어느 곳에 정의된 변수는 함수 내부 어디에서도 볼 수 없습니다. 기능은 어디서나 볼 수 있습니다.
var obj = function() {
var num = 1;
return { getValue: function() {
alert(num); //정의되지 않음
var num = 2
//2
}
}
} ();
obj.getValue();
클로저
이른바 클로저란 함수가 함수 외부에 정의된 변수를 사용할 수 있음을 의미합니다. , 함수는 컨텍스트가 생성될 때 변수에 액세스할 수 있습니다.
var hello = "hello word!";
function sayHello() {
alert(hello);
}
sayHello()
var obj = function() {
var value = 0;
setValue: function(val) {
value = typeof val === 'number' ? val : 1
},
getValue: function() {
반환 값; >}
}
} ();
obj.setValue('a')
alert(obj.getValue()) //1
지불 마지막 줄 ()에 주목하세요, ()는 호출 연산자인데, 이는 함수가 즉시 호출되어 호출 결과를 반환한다는 의미입니다. 따라서 obj는 함수를 참조하는 것이 아니라 두 가지 메서드가 포함된 함수에서 반환된 개체를 참조하며, 이 두 메서드는 값 변수에 액세스하는 특권을 누립니다.
클로저를 설명하기 위해 인터넷에 널리 유포되는 외부 함수의 지역 변수에 액세스하는 내부 함수의 또 다른 예를 들어보겠습니다. 해당 목록 항목을 클릭하면 해당 시퀀스 번호가 팝업됩니다.
코드 복사 코드는 다음과 같습니다.
test1
test2
test3
var test = function() {
var num = document.getElementsByTagName("li")
var i
for (i = 0; i < num.length; i ) {
num[i].onclick = function() {
alert(i); //내부 함수는 외부 함수 변수에 액세스할 수 있습니다. i의 최종 값은 3입니다.
/ /생성자의 i 값 대신 3
}
}
alert(i); //3
}
test()
다음 작성 방법으로 올바른 결과를 얻을 수 있습니다.
var test = function() { var num = document.getElementsByTagName("li")
var i
for (i = 0; i < num.length ; i ) {
num[i].onclick = function(i) {
return function() {
alert(i 1)
} (i); 생성자가 실행을 위해 즉시 i 값을 전달합니다. 이제 onclick에 바인딩된 함수는
//line
}
alert(i); }
테스트( )