Javascript를 사용하여 배열이 비어 있는지 확인하려면 어떻게 합니까?

우리는 계속해서 Flexiple의 강좌 시리즈를 배워서 흔히 볼 수 있는 용례 뒤에 있는 코드와 개념을 설명한다.이 문서에서, 우리는 자바스크립트를 사용하여 그룹이 비어 있는지 확인하는 특정한 상황을 해결할 것입니다.

우리 이거 어디서 쓸 수 있어요?
그룹이 비어 있는 상태에서 특정 스크립트를 실행하려면 enabling or disabling buttons 필수 필드에 입력이 있는지 여부에 따라 유용할 수 있습니다.
만약 프로그래밍 초보자나javascript에 대해 매우 익숙하지 않다면, 우리는 문장의 모든 부분이 매우 유용하기 때문에 전체 문장을 통독하는 것을 권장합니다.
단, 코드만 찾고 있다면 빠르게 볼 수 있습니다section below.

카탈로그
  • Code Implementation to check if an array is empty or not using Javascript
  • Browser Support

  • 자바스크립트를 사용하여 그룹이 비어 있는지 확인하기
    우리는 수조가 비어 있는지 확인하고 특정한 함수를 사용하는 원인을 알아보기 위해 코드와 시범을 빠르게 훑어볼 것이다.
    //To check if an array is empty using javascript
    function arrayIsEmpty(array){
        //If it's not an array, return FALSE.
        if(!Array.isArray(array)){
            return FALSE;
        }
        //If it is an array, check its length property
        if(array.length == 0){
            //Return TRUE if the array is empty
            return true;
        }
        //Otherwise, return FALSE.
        return false;
    }
    

    코드 해석
    이 코드를 한 걸음 한 걸음 분해합시다!
  • 우선, 우리는 수조를 사용하여 변수가 수조인지 검사한다.isArray () 방법입니다.
  • 전달된 변수가 수조라면 조건!어레이isArray()는 False가 되므로 변수가 else 조건으로 이동합니다.
  • 전달된 변수가 배열(예: 정의되지 않은 배열)이나 다른 변수 유형(예: 문자열 또는 객체)이 아닌 경우 함수는 False를 반환합니다.
  • 변수가 수조임을 확인한 후 현재 우리는 수조로 수조의 길이를 검사할 수 있다.길이 속성.
  • 객체의 길이가 0이면 배열이 비어 있으면 함수는 TRUE를 반환합니다.
  • 그렇지 않으면 배열이 비어 있지 않으며 함수는False를 반환합니다.

  • Javascript를 사용하여 배열이 비어 있는지 확인하는 데모
    var fruitArr = new Array('Apple', 'Mango', 'Grapes');
    
    //An example of a JavaScript array that is empty.
    var arrTwo = new Array();
    
    console.log(arrayIsEmpty(fruitArr)); //returns FALSE
    console.log(arrayIsEmpty(arrTwo)); //returns TRUE
    

    출력
    FALSE
    TRUE
    

    출력 해석
  • 에서 과일arr는 하나의 수조이기 때문에 두 번째 조건에 들어가서 수조의 길이가 비어 있는지 검사할 수 있다.
  • 배열에 3개의 요소가 있기 때문에 비어 있지 않기 때문에 함수는False를 되돌려줍니다.
  • 두 번째 상황에서arrTwo도 하나의 수조이기 때문에 두 번째 상황에 들어간다.
  • 여기는 수조가 비어 있기 때문에 함수가True로 되돌아옵니다.

  • 수조를 왜 사용해?isArray () 방법?
    어레이isArray () 방법은 변수가 그룹인지 확인하는 데 사용되며,null과 정의되지 않은 상황을 자동으로 제거하고, 추가 스크립트를 작성해서 검사할 필요가 없습니다.
    어레이다음 경우 isArray () 메서드가 true로 돌아갑니다.
    Array.isArray([]);
    Array.isArray([3]);
    Array.isArray(new Array());
    Array.isArray(new Array('apple', 'mango', 'grapes'));
    Array.isArray(new Array(5));
    Array.isArray(Array.prototype);
    
    참고: 배열.원형 자체가 하나의 수조이기 때문에 함수 수조.isArray()가 TRUE를 반환합니다.
    어레이다음과 같은 경우 isArray()가 False를 반환합니다.
    Array.isArray();
    Array.isArray({});
    Array.isArray(null);
    Array.isArray(undefined);
    Array.isArray(21);
    Array.isArray('Random String');
    Array.isArray(true);
    Array.isArray(false);
    Array.isArray(new Uint8Array(32));
    Array.isArray({ __proto__: Array.prototype });
    

    우리는 typeof로 그룹을 대체할 수 있습니까?이사레?
    답은 정해지지 않았습니다. 자바스크립트의 그룹은array 대상의 실례이기 때문에 typeof는 type 대상을 되돌려줍니다.
    이를 설명하려면 다음 예를 고려하십시오.
    const array = ['a', 'b', 'c'];
    
    console.log(typeof array);   // output: 'object'
    
    console.log(array instanceof Array); // output: true
    

    우리 애리 대신 instanceof 써도 돼요?이사레?
    instanceof는 대부분의 경우 위치 진열에 사용할 수 있습니다.이사레, 진열.iArray는 instanceof보다 우수합니다. 프레임이나 창 같은 여러 상하문에서 정확하게 작업을 할 수 있지만, instanceof는 할 수 없습니다.
    이것은 자바스크립트에서 창이나 프레임마다 자신의 실행 환경이 있기 때문에 서로의 역할 영역이 다르기 때문이다.이것은 그것들이 서로 다른 내장 대상(즉 서로 다른 전역 대상, 서로 다른 구조 함수 등)이 있다는 것을 의미한다.예를 들어 스크립트가 instanceof를 사용하여 대상을 함수를 통해 한 상하문에서 다른 상하문으로 전달할 때 의외의 결과를 초래할 수 있습니다.
    이런 상황을 감안하면 수조만 사용하는 것이 좋다.iArray, 특히 프레임워크, 라이브러리, 플러그인을 만들 때 사용 환경을 알 수 없습니다.

    길이 속성 사용
    일단 우리가 하나의 수조만 처리할 것을 확정하면, 우리는 수조가 비어 있는지, 아니면 length 속성을 사용하지 않는지 쉽게 검사할 수 있다.배열의 길이가 0이면 배열이 비어 있습니다. 그렇지 않으면 배열이 비어 있지 않습니다.
    우리는 왜 처음부터 length 속성을 사용하지 않았을까?이것은 코드를 더욱 간단하게 하지 않습니까?
    True, 그러나length 속성은 비수조 변수에 대해서도 비어 있기 때문에,length 속성을 사용하기 전에 수조를 처리해야 합니다.

    브라우저 지원
    어레이isArray 방법very good browser support은 ES5 규범의 일부이기 때문이다.그러나 대상 브라우저에 지원이 부족하면 아래에 제시된polyfill을 사용할 수 있습니다.
    polyfill은 ES3 사양과 호환되는 브라우저에 적용되며 프레임워크 간에 작동합니다.
    if (!Array.isArray) {
        Array.isArray = function(arg) {
            return Object.prototype.toString.call(arg) === '[object Array]';
        };
    }
    

    좋은 웹페이지 즐겨찾기