자바스크립트 유형 오류

JavaScript에서 TypeError는 일반적으로 작업의 값이 예상 유형이 아니기 때문에 수행할 수 없는 작업을 수행한 결과로 오류를 나타내는 개체입니다.

그러나 유형은 무엇입니까? 최신 버전의 JavaScript 사양인 ECMAScript에 따르면 9개의 데이터 및 구조 유형이 있습니다. 그 중 6개(널을 계산하면 7개)는 문자열, 숫자, bigint, 부울, 정의되지 않음 및 기호인 원시 데이터 유형입니다. TypeErrors가 작업 중에 트리거되는 이유를 이해하기 전에 JavaScript에서 9가지 유형을 검토해 보겠습니다. 유형을 분류하는 방법이 확실하지 않은 경우 typeof 연산자를 사용할 수 있습니다.

undefined:방금 선언된 변수에 자동으로 정의되는 값 유형입니다. 변수에 값을 정의하거나 추가하는 것을 잊었을 때 종종 typeerror 값이 undefined입니다.
부울:true 또는 false 값만 포함하는 논리적 데이터 유형입니다.
숫자:숫자 데이터 유형입니다.
문자열:역따옴표, 노래 또는 큰따옴표 안의 문자 시퀀스
BigInt:다른 프로그래밍 언어에서 bignum이라고도 하는 숫자 데이터 유형입니다.
Symbol:Symbol 함수를 호출하여 생성된 고유 식별자를 나타내는 값입니다.
객체:배열, 객체, 지도, 집합 등과 같이 'new' 키워드가 생성할 수 있는 구조적 유형 및 거의 모든 것
함수:다른 코드 조각에 의해 호출될 수 있는 코드 조각인 또 다른 비데이터 구조입니다.
null:일반적으로 존재하지 않는 개체 또는 주소를 나타내는 의도적인 값입니다.

가장 일반적인 JavaScript TypeErrors 및 해결 방법

변경할 수 없는 값을 변경하려고 하거나 값을 부적절한 방식으로 사용할 때 TypeErrors가 발생할 수 있습니다. 함수 또는 함수 내부의 연산자가 예상하는 형식과 호환되지 않는 함수에 인수가 전달될 때도 발생할 수 있습니다.

변경할 수 없는 값 변경

const 키워드를 사용하여 무언가에 값을 할당할 때 이는 일정하고 변경되지 않음을 의미합니다. 상수 변수의 값을 변경하려고 하면 TypeError가 발생합니다.

const a = 5
a = "5"
// Uncaught TypeError: Assignment to constant variable.

"5" 문자열을 식별하려는 식별자의 이름을 변경하기만 하면 이 문제를 해결할 수 있습니다.

const a = 5
const b = "5"

부적절한 방식으로 값 사용

또한 개발자는 값이 의도한 대로 사용되고 있는지 확인해야 합니다. 아래 예에서 "Cat" 및 "garfield"는 garfield가 Cat() 함수의 인스턴스인지 확인하려고 할 때 역방향입니다.

function Cat() {}
function Dog() {}
 
let garfield = new Cat()
 
Cat instanceof garfield
 
// Uncaught TypeError: Right-hand side of 'instanceof' is not callable

우리는 이 둘의 순서를 수정함으로써 이것을 고칠 수 있습니다.

function Cat() {}
function Dog() {}
 
let garfield = new Cat()
 
garfield instanceof Cat

함수에 필요한 유형과 호환되지 않는 인수

작업을 코딩할 때 개발자는 원하는 결과를 얻을 수 있는 방식으로 값을 사용하고 있는지 확인해야 합니다. null 값은 의도적으로 개체가 없음을 나타내는 데 사용할 수 있지만 아래에서 사용하는 방식은 함수에서 예상하는 형식과 호환되지 않는 인수로 사용되기 때문에 TypeError가 발생합니다.

참가자의 81%는 부트캠프에 참석한 후 기술 직업 전망에 대해 더 자신감을 느꼈다고 말했습니다. 지금 부트캠프에 참여하십시오.

부트캠프 졸업생은 부트캠프 시작부터 첫 직장을 찾는 데까지 6개월도 채 걸리지 않았습니다.

 function readingErrorsAreImportant(a){
    if(a.length === 5){
      return "equals five"
    } else if(a.length > 5) {
      return "Greater than five"
    }  else {
      return "Less than five"
    }
   }
   console.log(readingErrorsAreImportant(null))
 
   // Uncaught TypeError: Cannot read property 'length' of null

예상되는 값 유형을 전달하여 이 문제를 해결할 수 있습니다. 숫자 값 유형과 같습니다.

function readingErrorsAreImportant(a){
    if(a.length === 5){
      return "equals five"
    } else if(a.length > 5) {
      return "Greater than five"
    }  else {
      return "Less than five"
    }
   }
   console.log(readingErrorsAreImportant(10))

결론

디버깅 방법을 이해하려면 코드에서 유형 오류가 발생하는 이유를 이해할 수 있어야 합니다. 유형을 분류하는 방법을 잘 모르는 경우 typeof 연산자는 디버깅을 어떻게 진행해야 하는지 더 잘 이해할 수 있도록 9가지 데이터 또는 구조적 유형 중 하나를 반환합니다.