javascriptでrejectを実装する方法


filterの使い方を勉強する過程で、reject課題実装でつまづいています。  
rejectはfilterとは違う動作をする。関数がTrueを返した場合は、結果の配列に含まないようにする必要がある。filterを使用して実装する。

一緒に付いている例もいまいち分かりません。15より上の数がreturnされるような気がするのですが、そもそも下記のコード動くはrejectが定義されていないと出ます。そこを定義しなければいけないのはわかるのですが、混乱しています。

**例**

[code]

    var numbers = [10, 20, 30];
    var lessThanFifteen = reject(numbers, function(number){
     return number > 15;
    });
    lessThanFifteen;
    結果：[10]
    
[/code]

**下記が正解なのですが、構文がやはり分からないです。**

[code]

    function reject(array, iteratorFunction) {
      return array.filter((element) => {
          return !iteratorFunction(element);
      });
    }
    
[/code]

iteratorFunctionこれは無名関数のようなものですか。  
`!iteratorFunction`の前にあるビックリマークがおそらくFalseの場合にリターンを意味すると思うのですが、これは`iteratorFunction(element)`を実行して返ってくる変数に対して行われているんですか？

コードの参照先  
<https://www.udemy.com/course/javascriptes6/>




> そもそも下記のコード動くはrejectが定義されていないと出ます。

私の環境では下記のようにすれば問題なく動いています。

[code]

    function reject(array, iteratorFunction) {
      return array.filter((element) => {
          return !iteratorFunction(element);
      });
    }
    
    var numbers = [10, 20, 30];
    var lessThanFifteen = reject(numbers, function(number){
     return number > 15;
    });
    lessThanFifteen;
    
[/code]

> 下記が正解なのですが、構文がやはり分からないです。  
>  iteratorFunctionこれは無名関数のようなものですか。

おそらく構文がわかっていないのでなく、無名関数が理解できていないようです。  
ご質問内の無名関数は

[code]

    function(number){
     return number > 15;
    }
    
[/code]

と

[code]

    (element) => {
          return !iteratorFunction(element);
    }
    
[/code]

です。

無名関数は匿名関数とも呼ばれるので、両方のワードで検索すると理解がもっと進むかと思います（以降で簡単に無名関数の説明をします）。

多くの入門書では関数に名前を付けて定義しています。

[code]

    function hoge() {
      // なにか処理
    }
    
[/code]

↑このような感じです（この関数の名前はhoge）。しかし関数の作り方は名前を付けなくてもできます。

[code]

    function() {
      // なにか処理
    }
    
[/code]

↑無名関数。`function`と`()`の間に名前が書いてありませんから、名前はありません。名前がないのでこれが無名関数です。

さて、ではなぜ無名関数を使うのでしょうか。JavaScriptのような関数型言語のパラダイム（考え方）を取り入れた言語では、「関数に関数が渡せる」ということがとても重要な考え方のひとつとなります。こういったものを「高階関数」といいます。

ご質問のコード内では

[code]

    function(number){
     return number > 15;
    }
    
[/code]

という実引数が、reject関数のiteratorFunction仮引数に渡ってきているのです。  
実際にこの無名関数が実行されるのは `return !iteratorFunction(element);` の行が評価されるタイミングです。

名前を付けた関数をreject関数に渡すことも可能ですが、名前をいちいちつけるのは手間なので、無名関数として渡すテクニックが多く見受けられます。

関数型言語、高階関数、無名関数といったテクニックをマスターするのはすぐにできることではありません（おそらくもっとシンプルな例をたくさん試すのが良いと思います）。  
英語ですが、[Can Your Programming Language Do This? – Joel on
Software](https://www.joelonsoftware.com/2006/08/01/can-your-programming-
language-do-this/) はこれらの関数言語型のアプローチの理解の助けになりますので、読了されることをおすすめします。

上記を踏まえたうえでもう一度

> iteratorFunctionこれは無名関数のようなものですか。

について短く回答すると、iteratorFunctionには無名関数の処理が渡ってきていますが、無名関数ではありません。という回答になります。

そして

>
> `!iteratorFunction`の前にあるビックリマークがおそらくFalseの場合にリターンを意味すると思うのですが、これはiteratorFunction(element)を実行して返ってくる変数に対して行われているんですか？

`!`
は真偽値を反転させるためのものなので、「Falseの場合にリターンを意味する」というような場合わけはありません。リターンの役割を担っているのは`return`自体です。真偽値の反転は`iteratorFunction(element)`の返り値に対して行われています。




> そもそも下記のコード動くはrejectが定義されていないと出ます。

私の環境では下記のようにすれば問題なく動いています。

[code]

    function reject(array, iteratorFunction) {
      return array.filter((element) => {
          return !iteratorFunction(element);
      });
    }
    
    var numbers = [10, 20, 30];
    var lessThanFifteen = reject(numbers, function(number){
     return number > 15;
    });
    lessThanFifteen;
    
[/code]

> 下記が正解なのですが、構文がやはり分からないです。  
>  iteratorFunctionこれは無名関数のようなものですか。

おそらく構文がわかっていないのでなく、無名関数が理解できていないようです。  
ご質問内の無名関数は

[code]

    function(number){
     return number > 15;
    }
    
[/code]

と

[code]

    (element) => {
          return !iteratorFunction(element);
    }
    
[/code]

です。

無名関数は匿名関数とも呼ばれるので、両方のワードで検索すると理解がもっと進むかと思います（以降で簡単に無名関数の説明をします）。

多くの入門書では関数に名前を付けて定義しています。

[code]

    function hoge() {
      // なにか処理
    }
    
[/code]

↑このような感じです（この関数の名前はhoge）。しかし関数の作り方は名前を付けなくてもできます。

[code]

    function() {
      // なにか処理
    }
    
[/code]

↑無名関数。`function`と`()`の間に名前が書いてありませんから、名前はありません。名前がないのでこれが無名関数です。

さて、ではなぜ無名関数を使うのでしょうか。JavaScriptのような関数型言語のパラダイム（考え方）を取り入れた言語では、「関数に関数が渡せる」ということがとても重要な考え方のひとつとなります。こういったものを「高階関数」といいます。

ご質問のコード内では

[code]

    function(number){
     return number > 15;
    }
    
[/code]

という実引数が、reject関数のiteratorFunction仮引数に渡ってきているのです。  
実際にこの無名関数が実行されるのは `return !iteratorFunction(element);` の行が評価されるタイミングです。

名前を付けた関数をreject関数に渡すことも可能ですが、名前をいちいちつけるのは手間なので、無名関数として渡すテクニックが多く見受けられます。

関数型言語、高階関数、無名関数といったテクニックをマスターするのはすぐにできることではありません（おそらくもっとシンプルな例をたくさん試すのが良いと思います）。  
英語ですが、[Can Your Programming Language Do This? – Joel on
Software](https://www.joelonsoftware.com/2006/08/01/can-your-programming-
language-do-this/) はこれらの関数言語型のアプローチの理解の助けになりますので、読了されることをおすすめします。

上記を踏まえたうえでもう一度

> iteratorFunctionこれは無名関数のようなものですか。

について短く回答すると、iteratorFunctionには無名関数の処理が渡ってきていますが、無名関数ではありません。という回答になります。

そして

>
> `!iteratorFunction`の前にあるビックリマークがおそらくFalseの場合にリターンを意味すると思うのですが、これはiteratorFunction(element)を実行して返ってくる変数に対して行われているんですか？

`!`
は真偽値を反転させるためのものなので、「Falseの場合にリターンを意味する」というような場合わけはありません。リターンの役割を担っているのは`return`自体です。真偽値の反転は`iteratorFunction(element)`の返り値に対して行われています。

