NEW ARTICLE
Rubyのメタプログラミングを極める：コードを自在に操る技術
  1. HOME
  2. javascript
  3. javascript エラー「Uncaught TypeError: xxx.filter is not a function」の解決方法

javascript エラー「Uncaught TypeError: xxx.filter is not a function」の解決方法

javascript エラー「Uncaught TypeError: xxx.filter is not a function」の解決方法

javascriptで、エラー「Uncaught TypeError: xxx.filter is not a function」が発生した場合の原因と解決方法を記述してます。配列以外に「filter」を使用したときに主に発生します。「chrome」や「firefox」や「safari」の各ブラウザのエラーメッセージの画像もキャプチャしてます。

目次

環境

  • OS windows11 pro 64bit
  • Apache 2.4.43
  • ブラウザ chrome 110.0.5481.178
Javascript サンプル集はこちら

エラー内容

以下の、文字列に対して「filter」実行したコードにて発生。

const str = '123456';

const result = str.filter(v => v % 2 === 0);

エラーメッセージ

Uncaught TypeError: str.filter is not a function

画像

firefox107の場合でも同じエラーが発生します。

Uncaught TypeError: str.filter is not a function

画像

safari15.5では、以下のエラーとなります。

TypeError: str.filter is not a function. (In 'str.filter(v => v % 2 === 0)', 'str.filter' is undefined)

画像

原因

「filter」は、文字列に使用できないため
※オブジェクトなどにも使用しても同じエラーが発生します。

const obj = {a: 1, b: 2, c: 3};

const result = obj.filter(v => v % 2 === 0);
// Uncaught TypeError: obj.filter is not a function

解決方法

一度、文字列を配列化して使用して「toString」や「join(“”)」などで文字列に戻す。

const str = '123456';

const result = [...str].filter(v => v % 2 === 0);

console.log( result );
// ['2', '4', '6']

console.log( result.toString() );
// 2,4,6

console.log( result.join("") );
// 246

または、配列であるかを判定して使用します。

三項演算子を使ってif文を1行で書く
const str = '123456';

const result = Array.isArray(str) ? str.filter(v => v % 2 === 0) : '配列ではありません';

console.log(result); // 配列ではありません