prosource

자바스크립트에서 언제, 왜 '거짓'을 반환해야 합니까?

probook 2023. 9. 10. 12:21
반응형

자바스크립트에서 언제, 왜 '거짓'을 반환해야 합니까?

왜 , 요 요 ?return false자바스크립트로?

, 등 이벤트 핸들러에서onsubmit , 을 하는 은 가 되지 입니다 입니다 되지 을 .그러니까, 예를 들어,onsubmit경우, 이것은 양식이 제출되지 않았다는 것을 의미합니다.

이벤트 핸들러에 'return false;' 문을 입력해야 하는 경우가 많다는 사실을 말씀하시는 것 같습니다. 즉, 이벤트 핸들러에 'return false;' 문을 입력해야 한다는 것입니다.

<a href="#" onclick="doSomeFunction(); return false;">...

이 경우 'return false;'는 href="#"로 표시된 것처럼 브라우저가 현재 위치로 점프하지 못하게 합니다. 대신 doSomeFunction()만 실행됩니다.이 기능은 이벤트를 앵커 태그에 추가할 때 유용하지만 브라우저가 클릭할 때마다 각 앵커로 위아래로 이동하지 않도록 할 때 유용합니다.

이벤트 전파를 중지하는 데 사용됩니다.클릭 이벤트 핸들러(예: 클릭 이벤트 핸들러)를 사용하면 두 요소가 모두 표시됩니다.

-----------------------------------
| element1                        |
|   -------------------------     |
|   |element2               |     |
|   -------------------------     |
|                                 |
-----------------------------------

내부 요소(element2)를 클릭하면 두 요소(1과 2) 모두에서 클릭 이벤트가 트리거됩니다.그것은 "이벤트 버블링" 이라고 불립니다.element2에서만 이벤트를 처리하려면 이벤트 처리기가 false를 반환하여 이벤트 전파를 중지해야 합니다.

다른 예로는 클릭 핸들러의 링크가 있습니다.링크 양식 작동을 중지하려면요.온클릭 핸들러를 추가하고 false를 반환할 수 있습니다.이벤트가 기본 처리기로 전파되는 것을 중지합니다.

어... 부울함수에서 '사실이 아님'을 나타내는 것은 어떻습니까?

저는 또한 "js, return false;"를 언제 사용할 것인지 검색한 후 이 페이지를 찾았습니다. 다른 검색 결과 중에는 Chris Coyier의 CSS-Tricks 사이트에서 훨씬 더 유용하고 간단한 페이지가 있었습니다.'return false'와 'e.preventDefault()'의 차이입니다.

그의 글의 요지는 다음과 같습니다.

함수 {return false; }

// 다음과 같음

함수(e) {e.preventDefault(); e.stopPropagation(); }

그래도 전체 기사를 읽는 것을 추천합니다.

업데이트: return false;를 e.preventDefault(); & e.stopPropagation()의 대체품으로 사용하는 장점을 주장한 후, 동료 중 한 명이 return false 또한 콜백 실행을 중지한다고 지적했습니다. jQuery Events: Return False 사용 중지(Mis).

의 jQuery의 를 할 때eachfunction, returning true or false는 의미가 있습니다.문서 참조

제 생각에 더 좋은 질문은 부울 리턴 값 집합을 평가하는 경우 true/false를 사용하지 않는 이유입니다.제 말은, 당신은 아마도 참/무, 참/-1, 다른 잡동사니를 가질 수도 있다는 겁니다.대체할 자바스크립트 "falsey" 값인데 왜 그러십니까?

앵커 태그에서 javascript 코드를 트리거하려면 javascript:pseudo-protocol 대신 on click handler를 사용해야 합니다.onclick handler 내에서 실행되는 javascript 코드는 true 또는 false(또는 true 또는 false로 평가되는 표현보다 더 나은 표현)를 태그 자체로 반환해야 합니다. 만약 true로 반환되면 앵커의 HREF는 일반 링크처럼 따라갑니다.false를 반환하면 HREF가 무시됩니다.이 때문에 온클릭 핸들러 내의 코드 끝에 "return false;"가 포함되는 경우가 많습니다.

어떤 일이 발생하지 않도록 반환 false를 사용합니다.따라서 submit에서 실행 중인 스크립트가 있으면 false를 반환하면 submit이 작동하지 않습니다.

함수에서 반환문이 호출되면 이 함수의 실행이 중지됩니다.지정된 경우, 주어진 값이 함수 호출자에게 반환됩니다.식을 생략하면 대신 정의되지 않은 것이 반환됩니다.

자세한 내용은 의 MDN 문서 페이지를 참조하십시오.

일부 기능이 잘못되었거나(일부 테스트에 의해) 일부 기능을 중지하려는 경우에만 false를 반환합니다. 예를 들어 "제출 시"에 false를 반환합니다.

또한, https://www.w3schools.com/jsref/event_preventdefault.asp 을 통해 읽을 수 있는 짧고 흥미로운 링크.

정의 및 용도

preventDefault() 메서드는 취소 가능한 경우 이벤트를 취소합니다. 즉, 이벤트에 속한 기본 액션은 발생하지 않습니다.

예를 들어, 다음과 같은 경우에 유용할 수 있습니다.

Clicking on a "Submit" button, prevent it from submitting a form
Clicking on a link, prevent the link from following the URL

참고: 모든 이벤트를 취소할 수 있는 것은 아닙니다.취소 가능 속성을 사용하여 이벤트가 취소 가능한지 확인합니다.

참고: preventDefault() 메서드는 DOM을 통해 이벤트가 더 이상 전파되는 것을 방지하지 않습니다.이를 처리하려면 stopPropagation() 메서드를 사용합니다.

왜 거짓으로 답하거나, 사실 왜 답례품을 답례합니까?

코드를return(val);함수에서 값을 반환합니다.val호출할 수 있습니다.아니면, MDN 웹 문서를 인용하자면,

...함수 실행을 종료하고 함수 호출자에게 반환할 값을 지정합니다. (출처: MDN 웹 Docs: .)

return false;그러면 이벤트 처리기에서 유용합니다. 이 값은 이벤트 처리기에서 추가 작업을 결정하는 데 사용되기 때문입니다.return false;일반적으로 처리기에서 발생하는 이벤트를 취소하는 동안return true;이벤트가 발생할 수 있습니다.MDN 웹 문서를 다시 인용하려면...

처리기의 반환 값에 따라 이벤트가 취소되었는지 여부가 결정됩니다.(출처: MDN Web Docs: DOM On Event Handlers)

이벤트를 취소하는 경우 false를 반환합니다. 그 자체로는 부족합니다.

당신도 사용해야 합니다.Event.preventDefault();그리고.Event.stopPropagation();.

이벤트 인터페이스의 preventDefault() 메서드는 이벤트가 명시적으로 처리되지 않을 경우, 이벤트의 기본 동작이 정상적으로 수행되지 않아야 함을 사용자 에이전트에게 알려줍니다(출처: MDN Webdocs).

  • : Event.stopPropagation(); 이벤트가 포함하는 부모의 DOM 내의 링크를 클릭하지 못하도록 중지합니다(즉, UI에서 두 링크가 시각적으로 중첩된 경우).

이벤트 인터페이스의 stopPropagation() 메서드는 캡처 및 버블링 단계에서 현재 이벤트의 추가 전파를 방지합니다. (출처: MDN Webdocs)

워킹 데모

이 데모에서는, 우리는 다음을 취소합니다.onclick링크의 기능과 링크가 클릭되지 않도록 방지합니다.return false;,preventDefault(),그리고.stopPropagation().

풀워킹 JSB 인 데모.

스택 오버플로 데모...

document.getElementById('my-link').addEventListener('click', function(e) {
  console.log('Click happened for: ' + e.target.id);
  e.preventDefault();
  e.stopPropagation();
  return false;
});
<a href="https://www.wikipedia.com/" id="my-link" target="_blank">Link</a>

언급URL : https://stackoverflow.com/questions/855360/when-and-why-to-return-false-in-javascript

반응형