JavaScript에서 in 연산자의 사용법은 무엇입니까?-JS 튜토리얼-php.cn

JavaScript에서 in 연산자의 사용법은 무엇입니까?

不言

풀어 주다： 2018-11-30 15:03:58

원래의

3381명이 탐색했습니다.

JavaScript에서 in 연산자의 사용법은 무엇입니까?에서 in 연산자는 어떻게 사용되나요? 이번 글에서는 자바스크립트에서 in 연산자의 사용법을 소개하겠습니다. 구체적인 내용을 살펴보겠습니다.

JavaScript에서 in 연산자의 사용법은 무엇입니까?

먼저 객체에 대한 in 연산자의 사용을 살펴보겠습니다

구체적인 예를 살펴보겠습니다.

코드는 다음과 같습니다

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
  <script type="text/javascript">
    function exec() {
        var data = new Object();
        data.id = 10;
        data.name = "曲奇饼干";
        data.price = 150;
        data.code = "PK-01";
        var elem = document.getElementById("output");
        var fieldname = "price";
        if (fieldname in data == true) {
          elem.innerText = "data 至" + fieldname + " 字段存在。";
        } else {
          elem.innerText = "data 至 " + fieldname + "字段不存在。";
        }
      }
  </script>
</head>
<body>
<input type="button" value="Exec" onclick="exec();" />
  <div id="output">输出</div>
</body>
</html>

로그인 후 복사

지침:

다음 코드를 사용하여 객체를 만들고 값을 할당합니다.

var data = new Object();
  data.id = 10;
  data.name = "曲奇饼干";
  data.price = 150;
  data.code = "PK-01";

로그인 후 복사

in 연산자를 사용하여 fieldname 변수에 할당된 필드(멤버)가 개체와 개체에 존재하는지 확인합니다. 이 코드에서는 이전 객체의 초기화 부분에 가격의 값이 대체되어 있으므로 해당 객체에 "price"가 존재하는지 확인하는 코드입니다. 데이터"가 출력 영역에 표시됩니다. 존재" 정보.

var elem = document.getElementById("output");  
var fieldname = "price";  
if (fieldname in data == true) {
    elem.innerText = "data 中 " + fieldname + " 字段存在";
  } else {
    elem.innerText = "data 中" + fieldname + " 字段不存在。";
  }

로그인 후 복사

실행 결과

웹 브라우저를 사용하여 위 HTML 파일을 표시하면 아래와 같은 효과가 표시됩니다.

JavaScript에서 in 연산자의 사용법은 무엇입니까?

[실행] 버튼을 클릭하면 "데이터에 가격 필드가 있습니다"라는 메시지가 표시되며 효과는 다음과 같습니다.

JavaScript에서 in 연산자의 사용법은 무엇입니까?

결과가 잘못된 예

이전 HTML 파일의 exec 함수 부분을 다음 코드로 변경합니다.

var fieldname ="price";

로그인 후 복사

는

var fieldname = "detail";

로그인 후 복사

가 됩니다. 데이터 객체가 없기 때문에 in 연산의 결과는 false입니다. <br/>

  function exec() {
        var data = new Object();
        data.id = 10;
        data.name = "曲奇饼干";
        data.price = 150;
        data.code = "PK-01";
        var elem = document.getElementById("output");
        var fieldname = "detail";
        if (fieldname in data == true) {
          elem.innerText = "data 中" + fieldname + " 字段存在。";
        } else {
          elem.innerText = "data 中 " + fieldname + "字段不存在。";
        }
      }

로그인 후 복사

실행 결과

웹 브라우저를 사용하여 위 HTML 파일을 표시하면 아래와 같은 효과가 표시됩니다.

JavaScript에서 in 연산자의 사용법은 무엇입니까?

[실행] 버튼을 클릭하면 "데이터에 가격 필드가 존재하지 않습니다"라는 메시지가 표시됩니다.

JavaScript에서 in 연산자의 사용법은 무엇입니까?

배열에서 in 연산자 사용

배열에서 in 연산자를 사용하면 지정된 위치의 배열 요소가 유효한지 또는 유효하지 않은지(= 정의되지 않음) 확인할 수 있습니다.

구체적인 예를 살펴보겠습니다

코드는 다음과 같습니다

<br/>

로그인 후 복사

지침:

배열을 초기화하고 다음 코드를 통해 값을 할당합니다.

 var data = new Array("Penguin", "Duck", "Pigion", "Owl", "Hawk");

로그인 후 복사

in 연산자를 사용하여 배열 데이터의 두 번째 요소가 유효한지 여부를 확인합니다. 이 코드 배열이 생성된 후에는 특별한 처리가 없으므로 유효하며 결과는 true이며 페이지에 "The second element is valid"라는 문자가 표시됩니다.

var elem = document.getElementById("output");  
if (2 in data == true) {
    elem.innerText = "第二个元素有效。";
  } else {
    elem.innerText = "第二个元素无效。";
  }

로그인 후 복사

실행 결과<br/>

웹 브라우저를 사용하여 위 HTML 파일을 표시하세요. 아래와 같은 효과가 표시됩니다.

JavaScript에서 in 연산자의 사용법은 무엇입니까?

[실행] 버튼을 클릭하면 화면 출력 필드에 "두 번째 요소가 유효합니다"라는 메시지가 표시됩니다.

JavaScript에서 in 연산자의 사용법은 무엇입니까?

요소가 유효하지 않을 때의 코드

위 HTML 파일을 다음 코드로 변경하세요.

로그인 후 복사

설명:

변경 포인트는 아래 exec 함수에서 요소를 제거하는 코드를 추가하는 것입니다.

function exec() {
    var data = new Array("Penguin", "Duck", "Pigion", "Owl", "Hawk");    
    delete data[2];
    var elem = document.getElementById("output");    
    if (2 in data == true) {
      elem.innerText = "第二个元素有效。";
    } else {
      elem.innerText = "第二个元素无效。";
    }
  }

로그인 후 복사

다음 코드를 사용하여 데이터 배열의 두 번째 요소(세 번째)를 삭제합니다. 삭제해도 요소는 삭제되지 않으므로 삭제 전후에 배열의 길이는 변하지 않습니다. 그러나 data[2]의 요소가 삭제되었으므로 data[2]는 정의되지 않습니다.