이번에는 JS에서 함수의 중요성과 JS에서 함수를 사용할 때 주의사항에 대해 알려드리겠습니다. 실제 사례를 살펴보겠습니다.
object이므로 다음을 수행할 수 있습니다.
리터럴을 통해 생성
변수, 배열 요소 및 properties(속성)
에 할당은 함수
동적으로 생성 및 할당할 수 있는 속성이 포함되어 있습니다. 위의 개체는 함수가 다른 개체와 다릅니다. 개체를 호출할 수 있습니다.
JS에는 변수 호이스팅(variable hoisting)이 있습니다. 변수가 var로 선언되면 즉시 현재 범위의 맨 위로 승격됩니다(let 및 const로 선언된 변수는 그렇지 않음). 예:
1 function a() {2 console.log(b);3 var b = 10;4 }5 a(); //undefined
위 코드의 실행 결과는 정의되지 않았습니다. 그 이유는 var를 통해 b 변수가 선언되면 변수 승격이 발생하고 즉시 현재 범위의 최상위로 승격되기 때문입니다 (b가 아직 정의되지 않은 경우 선언 직후 승격이 발생한다는 점에 유의하세요!)
, this 시간의 "현재 범위"는 함수 a의 범위입니다. 따라서 위의 코드는 실제로는 다음과 같습니다. 1 function a() {2 var b; //变量的声明被提升至当前作用域顶部3 console.log(b);4 b = 10;5 }6 a();
변수 b의 선언은 두 번째 줄로 승격되고(선언만 승격됨) 이때 b에는 값이 할당되지 않으므로 코드는 계속해서 콘솔의 세 번째 줄까지 실행합니다. log(b)이면 undefound가 출력됩니다.
JS에는 변수 승격 외에도 "기능 승격"도 있습니다. 같은 방식으로 함수도 승격되지만 해당 기능은 단순히 선언된 승격이 아니라 "전체 승격"입니다. 아래 코드를 봐주세요.
1 function a() {2 b();3 function b() {4 console.log("yes!");5 }6 }7 a(); //yes!
이 시점에서는 b 함수가 정상적으로 실행될 수 있습니다. 이는 바로 함수가 승격되어 "전체적으로 승격"되어 b()가 정상적으로 실행될 수 있기 때문입니다. 이 코드는 실제로 다음과 같습니다.
1 function a() {2 function b() {3 console.log("yes!");4 }5 b();6 }7 a(); //yes!
일반 형식으로 선언된 함수만 승격될 수 있다는 점에 유의하세요!
예: 1 function a() {2 b();3 var b = function() { //字面量声明的函数4 console.log("yes!");5 }6 }7 a(); //报错
여기의 익명 함수는 리터럴을 통해 선언되므로 함수 승격이 없으며 오류가 보고됩니다.
그런데 변수와 함수를 동시에 선언하면 누가 우선권을 갖게 될까요?
JS에서 함수를 "일급 시민"이라고 부르는 이유 중 하나는 승격이 발생하면 해당 함수가 범위의 최상위로 승격된다는 것입니다! 예:
1 function a() {2 var b = 10;3 function b () {4 console.log("yes!");5 }6 console.log(b);7 console.log(typeof b);8 }9 a(); //10 number
이 코드에서 변수 b의 선언은 호이스팅되지만 "일급 시민"인 함수는 변수 b의 선언 위에 호이스팅됩니다. 코드 실행 단계에서는 b에 10이 할당되므로 출력 결과는 b가 10이고 유형이 숫자가 됩니다. 이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!
추천 도서:WeChat 미니 프로그램에서 양방향 데이터 바인딩을 구현하는 방법
JavaScript에 최적화된 DOM
위 내용은 JS에서 함수의 중요성의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!