web-dev-qa-db-ja.com

矢印で値を返すことが期待されています。関数array-callback-return。どうして？

反応コードのこの部分でコンパイル警告が表示される理由を理解しているいくつかの問題があります

_fetch('/users')
        .then(res => res.json())
        .then(data => {
            data.map(users => {
                console.log(users);
            });
        });
_

私が得ている警告は_Expected to return a value in arrow function array-callback-return_です

しかし、私はまだ_/users_からjsonオブジェクトの値を取得しており、それらは個別にコンソールに出力されます。オブジェクトは次のとおりです。

_    {
        id: 1,
        username: "Foo"
    }, {
        id: 2,
        username: "Bar"
    }
_

Returnステートメントがありませんか、またはmapが.then()の後に値を返す方法がありませんか？コンパイルの警告が表示される理由はわかりません。

javascriptarraysecmascript-6arrow-functions
9
Chef1075

_data.map_関数（_Array.map_仕様を確認： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map ） 1つの配列（あなたの場合はdata）を新しい配列に変換します。このマッピングは、_data.map_の引数によって定義されます。 _data.map_（コールバック関数）の引数、あなたの場合は矢印関数users => {console.log(users);}は値を返さなければなりません。各配列要素の値を返すことで、_data.map_がマッピングを定義します。

しかし、あなたの場合、コールバック関数は何も返さず、単に_console.log_ sを返します。あなたの場合、_data.forEach_（ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach ）を使用できます'_Array.map_機能を使用しないでください。

注：_data.map_を使用することにした場合は、コールバックの引数として（複数ではなく）単一の名前を使用する必要があります。data.map(user => {console.log(user);});は各ユーザーに対して呼び出されます。

19
croraf

MDNから：

Map（）メソッドは、呼び出し配列内のすべての要素で提供された関数を呼び出した結果で新しい配列を作成します。

つまり、mapメソッドを返す必要があります。したがって、次のようにコードを変更する必要があります。

fetch('/users')
    .then(res => res.json())
    .then(data => {
        data.map(users => {
            return console.log(users);
        });
    });

またはmap（）の代わりにforEach（）を使用します

6
Cecil

配列を変更する必要がなく、単にconsole.log（）を実行する必要がない場合は、代わりにdata.forEach（）を実行できます。警告は表示されません。 Mapは、配列を変換した後に値を返すことを期待しています。

fetch('/users')
        .then(res => res.json())
        .then(data => {
            data.forEach(users => {
                console.log(users);
            });
        });
4
Rodius