javascript エラー「Uncaught TypeError: xxx.map is not a function」の解決方法
- 作成日 2022.11.09
- javascript
- javascript
javascriptで、エラー「Uncaught TypeError: xxx.map is not a function」が発生した場合の原因と解決方法を記述してます。配列以外に「map」を使用した場合に発生します。「chrome」や「firefox」や「safari」の各ブラウザのエラーメッセージの画像もキャプチャしてます。
環境
- OS windows11 pro 64bit
- Apache 2.4.43
- ブラウザ chrome 107.0.5304.88
エラー内容
以下の、オブジェクトに対して「map」を使用したコードで発生。
const obj = {
a: 1,
b: 2,
c: 3,
};
obj.map(function(v){
return v + 1;
});
エラーメッセージ
Uncaught TypeError: obj.map is not a function
画像
firefox106の場合では、以下のエラーが発生します。
Uncaught TypeError: obj.map is not a function
画像
safari15.5では、以下のエラーとなります。
TypeError: obj.map is not a function. (In 'obj.map(function(v){
return v + 1;
})', 'obj.map' is undefined)
画像
原因
「map」は配列以外には使用できない。数値などに使用しても同様のエラーとなります。
const num = 123;
num.map(function(v){
return v + 1;
});
// Uncaught TypeError: num.map is not a function
解決方法
「map」を使用するのであれば、一度、配列化して使用します。
const obj = {
a: 1,
b: 2,
c: 3,
};
const result = Object.entries(obj).map(function([key,value]){
return {[key]: value + 1};
});
console.log( result );
// [{a: 2},{b: 3},{c: 4}]
オブジェクトの値を個別に操作したいのであれば「forEach」などを使用します。
const obj = {
a: 1,
b: 2,
c: 3,
};
let newObj = {};
// 反転したオブジェクトを生成
Object.keys(obj).forEach(function(key){
newObj[key] = obj[key] + 1;
});
console.log( newObj );
// {a: 2, b: 3, c: 4}
-
前の記事
GAS googleドライブ内のファイルの説明を取得する 2022.11.08
-
次の記事
mac ショートカットキーでターミナルをクリアにする 2022.11.09
コメントを書く