map

16572 ワード
テキストリンク

map


関数メソッド
  • は、配列内のインデックス上で関数を実行し、関数の結果値で新しい配列を作成する.
  • 変数があり、これらの値にすべての関数を適用したい場合はmap()関数
    • を使用します.
  • 既存のレイアウトは変わらない
  • 不確定度は
    • を含む.
  • 配列値を含むインデックス
    • のみを呼び出す.
  • 削除、割り当てまたは未定義のインデックスがX
    • に呼び出される.
    array.map(callbackFunction(currenValue, index, array), thisArg)
  • filter,foreachなどの構文
  • callbackFunctionとthisArgの2つのパラメータ
    -callbackFunction:新しい配列要素を作成する関数
    -thisArg:callback実行時に使用する値
  • callbackFunctionには3つのパラメータがあります
    -currentValue(処理する現在の要素)
    -index(処理する現在の要素のインデックス)
    -array(map()を呼び出す配列

    • 1.平方根（平方根）


    1.1

    var numbers = [4,9,16,25,36];
var result = numbers.map(Math.sqrt);
console.log(result);
    ->の値は2,3,4,5,6です

    2.値のx 2を既存の配列に入れる


    2.1


    • let numbers = [1, 2, 3, 4, 5]
let result = numbers.map(numbers => numbers * 2); 

    • let result = numbers.map(function(numbers){
	return numbers * 2;  
   }
);

    • let result = numbers.map(number => {
	console.log(number);
}
);
console.log(result);
    1. 2. すべての3回の値は2、4、6、8、10です.

    2.2

    var numbers = [ 1,2,3,4,5,6,7,8,9];
function multiplyTwo(number){
    return number *2;
}
혹은 
var newNumbers = numbers.map(multiplyTwo);
console.log(newNumbers);
    -> 2, 4, 6, 8, 10, 12, 14, 16, 18

    矢印関数

  • "=>"簡略化メソッドの関数宣言
  • リターン
    • を含む
  • 匿名関数としてのみ使用する
    • 関数式を使用して
  • 矢印関数を呼び出します.
  • コールバック関数
    • を使用
  • 関数が宣言されると、この関数にバインドするオブジェクト
    • が静的に決定される.
  • 矢印関数のthisは常に上位のthis(Lexicalthis)
    • を指します.
  • call、apply、bindメソッドを使用して変更することはできません.
  • メソッド
    • の定義は避けるべきである.
  • プロトタイプへの割り当て方法も避ける
    (矢印関数のthisは呼び出しメソッドのオブジェクトではなく、親のグローバルオブジェクトウィンドウを指します)
  • ジェネレータ関数として使用できません
    -コンストラクション関数にprototype propertyがあり、prototype propertyが指すprototypeオブジェクトのコンストラクション関数を使用します.矢印関数にはprototype property
    • はありません.
    () => { ... }//パラメータがない場合
    x => { ... }//パラメータが1つしかない場合は、カッコを省略できます
    (x, y) => { ... }//複数のパラメータがある場合は、括弧は省略できません
    var pow = function (x) { return x * x; }; 
	=== const pow = x => x * x; 
    var arr = [1, 2, 3];
var pow = arr.map(function (x) { 
  return x * x;
});
=== 
const arr = [1, 2, 3];
const pow = arr.map(x => x * x);

    3.制御可能オブジェクト（オブジェクト）タイプ


    オブジェクトは、、例えば
  • フィルタ関数であってもよい

    3.1

    var students = [
  {id:1, name:"james"},
  {id:2, name:"tim"},
  {id:3, name:"john"},
  {id:4, name:"brian"}
];
var names = students.map(student =>student.name);
console.log(names);
    ->値james、tim、john、brian

    4.リバース（リバース）


    4.1

    var numbers = [1,2,3,4,5,6];
var numbersReverse  = 
    numbers.map(number => number *2).reverse();
console.log(numbersReverse);
    ->値12,10,8,6,4,2

    5.アレイにアレイがある場合


    5.1

    var numbers = [[1,2,3],[4,5,6],[7,8,9]];
var newNumbers = numbers.map(array => 
       array.map(number => number *2));
console.log(newNumbers);
    ->値は[2,4,6],[8,10,12],[14,16,18]
    • JSONとJSONPの違いと使い方
    リアルなCSSアートハッキング