JavaScript TypeError

JavaScriptでは、TypeErrorは、実行できない操作を実行した結果としてのエラーを表すオブジェクトです。通常、操作の値が予期されたタイプではないためです。

しかし、タイプとは何ですか？ JavaScript仕様の最新バージョンであるECMAScriptによると、9つのデータと構造タイプがあります。そのうちの6つ（nullを数えると7つになることもあります）はプリミティブデータ型であり、文字列、数値、bigint、ブール値、未定義、およびシンボルです。操作中にTypeErrorsがトリガーされる理由を理解する前に、JavaScriptで9つのタイプを確認しましょう。タイプを分類する方法がわからない場合は、typeof演算子を使用できます。

1. undefined：宣言されたばかりの変数に自動的に定義される値のタイプ。変数の定義や値の追加を忘れると、typeerrorの値がundefinedになることがよくあります。
2. ブール値：trueまたはfalseの値のみを含む論理データ型。
3. 数値：数値データ型。
4. 文字列：バッククォート、歌、または二重引用符内の文字のシーケンス。
5. BigInt：他のプログラミング言語ではbignumと呼ばれることもある数値データ型。
6. Symbol：Symbol関数を呼び出して作成された一意の識別子を表す値。
7. オブジェクト：構造タイプと、配列、オブジェクト、マップ、セットなど、「new」キーワードで作成できるほとんどすべてのもの
8. 関数：他のコードから呼び出される可能性のあるコードスニペットである別の非データ構造。
9. null：通常、存在しないオブジェクトまたはアドレスを表す意図的な値。

最も一般的なJavaScriptTypeErrorsとその修正方法

変更できない値を変更しようとしたり、不適切な方法で値を使用したりすると、TypeErrorsがスローされる可能性があります。また、関数または関数内の演算子が期待する型と互換性のない引数が関数に渡された場合にも発生する可能性があります。

変更できない値の変更

constキーワードを使用して値を何かに割り当てる場合、これは定数であることを意味し、変更されません。定数変数の値を変更しようとすると、TypeErrorが発生します。

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

これは、「5」の文字列を識別したい識別子の名前を変更するだけで修正できます。

const a = 5
const b = "5"

不適切な方法で値を使用する

開発者は、値が意図したとおりに使用されていることも確認する必要があります。以下の例では、garfieldがCat（）関数のインスタンスであるかどうかを確認しようとすると、「Cat」と「garfield」が逆になります。

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

2つの順序を修正することでこれを修正できます。

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つのデータ型または構造型のいずれかが返され、デバッグをどのように進めるかをよりよく理解できます。