alis4ops.com을 만들고 계신 아버지를 위해 이 가이드를 작성했습니다.
다음과 같은 기능이 있습니다:
DragDrop.js에 정의된 Baba
function handleStartTouch(event) { draggedElement = event.target; const touch = event.touches[0]; touchStartX = touch.clientX - draggedElement.getBoundingClientRect().left; touchStartY = touch.clientY - draggedElement.getBoundingClientRect().top; } function handleMoveTouch(event) { event.preventDefault() if (draggedElement) { const touch = event.touches[0]; // ..more code } }
라인에서 draggedElement에 액세스하고 있음을 확인하세요.
hanldeMoveTouch는 호출 시 오류를 발생시키지 않습니다.
Chrome DevTools에서 if(draggedElement)에 중단점을 배치하면 draggedElement가 handlerStartTouch의 event.target에서 제공하는 것과 동일한 html 요소로 확인되는 것을 볼 수 있습니다
handleStartTouch에 정의되어 있음에도 불구하고 handlerMoveTouch에서 dragElement에 액세스할 수 있는 이유는 무엇입니까
더 일반적으로, 함수에 정의된 변수를 자바스크립트의 다른 함수에서 접근할 수 있는 이유는 무엇입니까?
handleStartTouch 기능을 살펴보세요:
function handleStartTouch(event) { draggedElement = event.target; const touch = event.touches[0]; touchStartX = touch.clientX - draggedElement.getBoundingClientRect().left; touchStartY = touch.clientY - draggedElement.getBoundingClientRect().top; }
구체적으로 다음 줄:
draggedElement = event.target;
두 키워드 중 하나를 사용하여 변수 이름 draggedElement를 선언하지 않습니다
예를 들어 다음과 같이 정의하지는 않습니다.
const draggedElement = event.target;
Javascript에서 변수 선언(키워드라고도 함)을 사용하지 않으면 JavaScript는 해당 변수를 전역 변수로 간주합니다.
두 가지 함수를 정의하는 다음 예를 살펴보세요.
// Takes in two arguments and returns the sum function add(x, y) { sum = x + y return sum } // prints sum if it is defined function printStatus() { if (sum) { console.log("Sum: ", sum) } else { console.log("Sum does no exist") } }
Chrome에서 DevTools 열기
콘솔에서 add(1,1)을 호출하세요
add(1,1) => 2
그런 다음 printStatus를 호출하세요
printStatus()가 add(x, y)에 정의된 변수 sum에 액세스할 수 있음을 알 수 있습니다
이는 변수 sum이 다음 키워드 없이 선언되기 때문입니다.
이제 add(x, y) add를 변경하여 합계에 대한 변수 선언을 사용하겠습니다
// Takes in two arguments and returns the sum function add(x, y) { const sum = x + y // use the variable declartion const return sum } // prints sum if it is defined function printStatus() { if (sum) { console.log("Sum: ", sum) } else { console.log("Sum does no exist") } }
콘솔 로그에 함수를 다시 정의해 보겠습니다.
새 개발 콘솔을 시작했기 때문에 이를 재정의해야 합니다.
이제 콘솔에서 add(2, 2)를 호출하세요
printStatus를 호출하여 add(x, y)에 정의된 변수 sum에 액세스할 수 있는지 확인하세요
printStatus() > Uncaught ReferenceError: sum is not defined at printStatus (<anonymous>:9:3) at <anonymous>:1:1
합계가 정의되지 않았다는 오류가 발생합니다
함수 내에서 변수 선언(const, let, var)으로 변수를 정의할 때 해당 변수의 범위가 함수 내에서만 적용됨을 확인합니다
함수 내에서 변수 선언이 없이 변수가 정의되면 해당 변수의 범위는 전역입니다.
Baba(그리고 이 글을 읽고 있는 다른 사람에게도) 도움이 되기를 바랍니다.
위 내용은 JS 변수 선언 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!