ホームページ >ウェブフロントエンド >jsチュートリアル >es6における各種データ型の拡張例を詳しく解説

es6における各種データ型の拡張例を詳しく解説

零下一度
零下一度オリジナル
2017-06-26 10:24:421830ブラウズ

1. string の拡張

  1. for...of

  2. includes、startsWith、endsWith によって走査できる文字列に Iterator を追加します。これらはすべてブール値を返し、2 番目のパラメータ (検索開始位置) をサポートします。 )、endsWith は最初の n 文字、他の 2 つは n 番目から最後までです

  3. repeat は新しい文字列を返します。パラメータは繰り返しの回数です (小数点以下は切り捨てられ、負の数値または Infnity が報告します)エラー、0 ~ -1 は 0 と同等、文字列は数値に変換されます)

  4. padStart、padEnd は先頭または末尾で完成します。最初のパラメータは文字列の最小長で、2 番目のパラメータは文字列の最小長です。パラメータは補完に使用されます 文字列

  5. テンプレート文字列 `${...}`

2. 数値の拡張

  1. Number.isFinite は、値が有限かどうかをチェックし、有限でない場合は false を返します。 -数値

  2. Number.isNaN は値が NaN であるかどうかをチェックします。NaN のみが true を返します。従来のメソッド isFinite isNaN は最初に Number() を呼び出して非数値を数値に変換します

  3. Number.parseInt()、Number.parseFloat() 従来のメソッドと同様に、その目的は、グローバルメソッドと言語のモジュール化

  4. Number.isInteger()を削減して、それが整数

  5. Numberであるかどうかを判断することです。 EPSILON は非常に小さい定数です。ok

  6. JS の正確な整数範囲: -2^53~2^53 (両端を除く)、

    Number.MAX_SAFE_INTEGER = Math。 pow(2, 53) - 1;
    Number.MIN_SAFE_INTEGER = -Number. MAX_SAFE_INTEGER;
    Number.isSafeInteger() は、整数がこの範囲内にあるかどうかを判断するために使用されます

  7. Math.trunc()整数部分を返します。

    Math.sign() は負の整数か 0 かを決定します。
    Math.cbrt() は数値の立方根を計算します。
    指数演算子もいくつかあります。 2 ** 3 === 8、これは特に大規模な演算の場合、配列の拡張

とは異なります。配列のようなオブジェクトと走査可能なオブジェクトを配列に変換し、拡張演算子は特定のオブジェクトを配列に変換することもできます。

map メソッドと同様に 2 番目のパラメーターを受け取り、処理された値を配列に返すことができます。 .of は値のセットを配列に変換します。

  1. copyWithin は指定された場所のメンバーを他の場所にコピーします。
    Array.prototype.copyWithin(target, start = 0, end = this.length)

  2. find は最初の修飾されたメンバーを検索し、パラメーターはコールバック関数です。

    findIndex は最初の修飾された配列メンバーを返します。

  3. fill の位置は、2 番目と 3 番目のパラメーターで開始値と値を指定できます。終了位置;

  4. キー、値、エントリ

  5. を含む、indexOfはセマンティックが不十分であり、内部的に使用されます = == 判断、

    [NaN].indexOf(NaN) // -1 , [NaN] .includes(NaN) // true

    Map の has はキー名の検索に使用され、Set の has は値の検索に使用されます
  6. 配列の空の位置には値がありません、[,,] の 0 // false, es6空の位置は未定義に変換されます。空の位置は避ける必要があります

  7. 4. 関数

  8. の拡張は、末尾以外のパラメーターがデフォルトを設定する場合に、デフォルト値を設定することが許可されます。値。実際、このパラメータは省略できません。

    デフォルト値が設定された後、関数の length 属性は、パラメータの数を指定せずに値を返します。デフォルト値セットが最後のパラメータではない場合、length 属性は後続のパラメータに含まれなくなります

パラメータのデフォルト値が設定されると、関数は宣言時に続行します。初期化では、パラメータは別のスコープ (コンテキスト) を形成します。初期化が完了すると、このスコープは消えます。パラメーターのデフォルト値が設定されていない場合、この構文の動作は表示されません。

  1. Rest パラメーター (... 変数名)
    length属性,将返回没有指定默认值的参数个数;
    如果设置了默认值的参数不是尾参数,那么length属性也不再计入后面的参数了;

  2. 一旦设置了参数的默认值,函数进行声明初始化时,参数会形成一个单独的作用域(context)。等到初始化结束,这个作用域就会消失。这种语法行为,在不设置参数默认值时,是不会出现的。

  3. Rest参数(...变量名)

  4. 扩展运算符(...),将一个数组转为用逗号分隔的参数序列。

    /* 替代数组的apply方法 */// ES5的写法function f(x, y, z) {  // ...}var args = [0, 1, 2];
    f.apply(null, args);// ES6的写法function f(x, y, z) {  // ...}var args = [0, 1, 2];
    f(...args);/* --------------------------------- */// ES5的写法Math.max.apply(null, [14, 3, 77])// ES6的写法Math.max(...[14, 3, 77])// 等同于Math.max(14, 3, 77);/* --------------------------------- */// ES5的写法var arr1 = [0, 1, 2];var arr2 = [3, 4, 5];
    Array.prototype.push.apply(arr1, arr2);// ES6的写法var arr1 = [0, 1, 2];var arr2 = [3, 4, 5];
    arr1.push(...arr2);
  5. 箭头函数使用注意:

    (1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。

    (2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。

    (3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。

    (4)不可以使用yield命令,因此箭头函数不能用作 Generator 函数。

 

五. 对象的扩展

  1. 属性简写表示法

  2. 属性名表达式,[变量名]

  3. 方法的name属性返回函数名(即方法名)

  4. Object.is,与===基本一致,不同在于一是+0不等于-0,二是NaN

    スプレッド演算子 (...)、配列をカンマ区切りのパラメーター シーケンスに変換します。
    🎜
    // es5实现Object.isObject.defineProperty(Object, 'is', {
      value: function(x, y) {if (x === y) {      // 针对+0 不等于 -0的情况  return x !== 0 || 1 / x === 1 / y;
        }// 针对NaN的情况return x !== x && y !== y;
      },
      configurable: true,
      enumerable: false,
      writable: true});
    🎜🎜🎜🎜 アロー関数の使用に関する注意事項: 🎜🎜(1) 関数本体内の this オブジェクトは、それが使用されるオブジェクトではなく、定義されているオブジェクトです。 🎜🎜(2) はコンストラクターとして使用できません。つまり、new コマンドは使用できません。それ以外の場合は、エラーがスローされます。 🎜🎜(3) arguments オブジェクトは関数本体に存在しないため、使用できません。これを使用したい場合は、代わりにrestパラメータを使用できます。 🎜🎜(4) yield コマンドが使用できないため、アロー関数をジェネレーター関数として使用できません。 🎜🎜🎜🎜 🎜🎜 5. オブジェクト拡張 🎜🎜🎜🎜 属性の省略形 🎜🎜🎜🎜属性名式、[変数名] 🎜🎜🎜🎜 メソッドの name 属性は関数名を返します (つまり、メソッド名) 🎜🎜🎜🎜Object.is、これは基本的に === と同じです。違いは、まず、+0-0 と等しくないことです。 、そして第二に、 NaN はそれ自体と等しいです🎜🎜🎜rrreee🎜
  5. Object.assign(target, o1, o2) は、同じ名前のプロパティがある場合、以前のプロパティが後で上書きされるように実装されています
    未定義と null はオブジェクトに変換できないため、それらがパラメータとして使用される場合、エラーが報告されます。Object.getOwnPropertyDescriptor メソッドはプロパティの説明オブジェクトを取得できます。

  6. プロパティのトラバーサル:

    for...in、Object.keys、Object.getOwnPropertyNames(obj)、Object.getOwnPropertySymbols(obj)、Reflect.ownKeys(obj)

  7. __proto__、Object.setPrototypeOf()オブジェクトのプロトタイプ オブジェクトを設定するために使用される同じ関数があります。 Object.getPrototypeOf()

  8. Object.keys()、Object.values()、Object.entries()

  9. Object.getOwnPropertyDescriptors はすべてを返します指定されたオブジェクトのプロパティ 独自の属性 (非継承属性) の説明オブジェクト

以上がes6における各種データ型の拡張例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。