JavaScript의 진위 판단으로 빠져들기 쉬운 점 7 선.

8989 단어 JavaScript초학자
초심자가 JS에서 진위 판정을 할 때 빠져들기 쉬운 곳을 가장 기본적인 것부터 차례로 7가지를 정리했다.
※ 문장 마지막에는 중상급자를 향한 퀴즈도 있으니 꼭 해보세요.

1. elseif 공간


우선 기본 중의 기본부터 다른 언어elseif처럼 기입하면SyntaxError.
물론 elif도 안 돼요.🐍

2. 배열 여부에 대한 판단


문자열이나 숫자typeof라면 판정할 수 있지만 수조라면'object'로 판정되기 때문에 사용할 수 없습니다.
그래서 사용Array.isArray().

const a = [1, 2]

console.log(typeof a) // => 'object'
console.log(Array.isArray(a)) // => true 

3. 배열이 비어 있는지 판단


문자열과 달리 수조는 비어 있어도 진!array으로 간주되기 때문에 판정할 수 없습니다.
따라서 수조의 길이가 0인지 여부에 따라 판단한다.

const arr = []

console.log(!arr) // => false
console.log(!arr.length) // => true 

if(!arr.length) {
  console.log('空です')
}

4. 객체가 비어 있는지 판단


수조와 마찬가지로 빈 대상도 진으로 간주된다.
그 밖에 대상에length 속성이 없습니다.
따라서 Object.keys(obj) 스토리지에서 모든 키를 사용할 수 있습니다.
그 배열의 길이가 0인지 아닌지를 보아라.

const obj = {key1: 1, key2: 2}

console.log(Object.keys(obj)) // => ["key1", "key2"]

if( Object.keys(obj).length ) {
  console.log('空じゃないよ')
}

5. 배열이나 객체가 동일한지 확인

===를 사용하여 수조나 대상의 내용이 같음을 확정할 수 없습니다.
실제로 아래의 공식은false이다.
const a = [1, 2]
const b = [1, 2]
console.log(a === b) // => false
확실히 a에서 요소b를 삭제해도 달라진 것이 없으며 둘을'다른 대상'으로 판단해도 나무랄 데가 없다.
그렇다면 양자의 내용이 같은지 아닌지를 판단하려면 어떻게 하면 좋을까? 간단하면서도 확실한 방법은 없는 것 같다.
스스로 판단용 함수를 만들 수 있지만, 쉽게 하려면 로데시 등 플러그인을 사용하는 게 좋다.
Lodash의.isEqual() 사용 예

6. 일반 수치의 판단 여부


InfinityNaN가 아닌 일반적인 수인지 아닌지를 판단하려는 경우다.
다음NaN 판정 코드는 예상대로 움직이지 않습니다.
잘못된 NaN 판정 예
if(num === NaN){
  console.log('NaNです(?)') 
}
JS의 규격NaN === NaNfalse이기 때문이다.
(또는 NaN 그 어떤 값에 비해false그래서 사용Number.isFinite().Number.isFinite(aug)aug±Infinity의 수치가 아닌 경우에만 되돌아온다NaN.

if( Number.isFinite(num) ) {
  console.log('numは普通の数値です')
}
※ IE는 true를 지원하지 않습니다.Number.isFinite()로 대체할 수 있습니다.

7. 대량 판정


JS는 적정 처리 수량의 상한선(253-1=907199254740991)을 정했다.
이 상한수를 초과한 계산을 사용하면 정확도를 보장할 수 없다.
계산 과정에서 이 상한선을 초과하면 수치가 부정확한 값으로 변해도 오류가 발생하지 않기 때문에 예상치 못한 동작이 발생할 수 있다.

실례


다음은 내가 엔지니어 첫해에 겪은 예(간략화)이다.
우선, 다음 규격의 IC카드가 있다고 가정하자.
  • 카드당 16비트 ID 할당(예: 319A-F3D5-EAE2-55E7)
  • 정확한 형식의 ID를 16진수 정수로 변환할 때 10곳에서 제거할 수 있습니다.
  • 예컨대isFinite()에서 하이픈을 제거하여 16진수로 사용합니다.ID: 319A-F3D5-EAE2-55E7이것은 10진법이다319AF3D5EAE255E710으로 나누기 어려우므로 잘못된 ID임을 알 수 있습니다.
    언뜻 보기에는 이 카드 ID의 정당성을 확인하려면 ID를 3574437354366195175로 변환한 뒤 10곳에서 찢어질 수 있는지 확인하면 된다.
    오류 검사 예
      // id取得、ハイフン除去などは省略
    
      console.log(id) // => "319AF3D5EAE255E7"
      const num = parseInt(id, 16)
    
      if(num % 10 !== 0) {
        throw new Error('不正なIDです') 
      }
    
    하지만 테스트 코드를 해보면 어떤 ID도 검사를 통과했는지 순조롭지 않다.
    왜 그랬을까? 16자리 아이디가 parseInt()로 바뀌었을 때 값이 커졌고 다음 몇 분은 0으로 반올림됐기 때문이다.
    마지막 0이 반올림된 결과 10을 반드시 다 쓸 수 있어'올바른 형식'판정을 많이 받았다.

    대량의 수량을 처리하기 위해


    앞으로 대량으로 처리할 수 있는 빅인트는 규격에 들어가지만 2018년 12월까지는 BigInteger.js 같은 플러그인만 사용할 수 있다.
    BigInteger 사용 예


    중상급자를 위한 제작진위 판정 수수께끼.
    위에서 언급하지 않은 디테일이 포함되어 있으니 꼭 놀아주세요.

    좋은 웹페이지 즐겨찾기