本記事では、JavaScriptのエラーの一つUncaught TypeError: Cannot read property ‘’ of undefinedが出た際の原因と対処法について解説しています。
JavaScriptの学習におすすめ書籍
1冊ですべて身につくJavaScript入門講座
メリット
- 誰でも分かるように嚙み砕いて説明してくれる
- アニメーションの知識が深く学べる
- 1つのWebサイトを作りながら学べる
ポチップ
先輩くんAmazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ！
後輩ちゃん初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね！
全プログラマー必見！
変数名/関数名にもう悩まない！
変数名/関数名にもう悩まない！
リーダブルコード
メリット
- 美しいコードが書けるが自然と書けるようになる
- 他の開発者が理解しやすいコードになる
著:Dustin Boswell, 著:Trevor Foucher, 解説:須藤 功平, 翻訳:角 征典
¥2,640 （2023/07/23 02:48時点 | Amazon調べ）
ポチップ
目次
エラーの原因と対処法
Cannot read property ‘x’ of undefined、日本語に訳すと「未定義のプロパティ「x」を読み取ることができません」という意味になります。
このエラーは、未定義(undefined)のプロパティに対して処理を実行させた場合に発生します。例えば下記のコードを実行してみましょう。
const infoObj = {
name: "Taro",
age:30,
};
console.log(infoObj.hobby); // -> undefined
console.log(infoObj.hobby.length); // -> Uncaught TypeError: Cannot read properties of undefined (reading 'length')nameObjを定義し、プロパティのfullNameを呼び出すと返り値でundefinedが返却されます。これはnameObjにfullNameというプロパティが存在しないためです。※プロパティを参照するだけであればエラーは発生しません。
このundefinedの値を保持しているプロパティに対して何かしらの処理を実行させると、「Cannot read property ‘x’ of undefined」のエラーが発生します。
意図的にundefinedの値を持たせたプロパティに対して、処理を実行させても同様のエラーが発生します。
const infoObj = {
name: "Taro",
age:30,
hobby: undefined, // ← undefinedを追加
};
console.log(infoObj.hobby.length); // -> Uncaught TypeError: Cannot read properties of undefined (reading 'length')ここまで来れば皆さんもうお分かりだと思いますが、これをエラーにならないようにするには処理を行いたいプロパティの値をundefined以外のものにします。
const infoObj = {
name: "Taro",
age: 30,
hobby: ["食べ歩き", "映画鑑賞"],
};
console.log(infoObj.hobby.length); // -> 2Uncaught TypeErrorの関連記事
あわせて読みたい
Uncaught TypeError: “” is not a functionの原因と対処法
本記事では、JavaScriptのエラーの一つUncaught TypeError: “” is not a functionが出た際の原因と対処法について解説しています。 【エラーの原因と対処法】 “x” is no…
あわせて読みたい
Uncaught TypeError: Cannot (read set) property of nullの原因と対処法
本記事では、JavaScriptのエラーの一つUncaught TypeError: Cannot (read set) property ‘’ of nullが出た際の原因と対処法について解説しています。 【エラーの原因と…
