ES 6の再学習は遅かれ早かれ返却します.

10428 ワード

es 6 javascript

このシリーズのブログはES 6の基礎文法の使用とまとめです.間違いがあれば、ご指摘ください.再学習ES 6の出てくる混はいずれ返すべきです.(三)主にfor ofサイクル、starts With()、endsWith()、includes()、repeat()方法が含まれます.
循環のいくつかの方法
一般的なforサイクル

for(let i=0;i

forEachサイクル
1.forEachの使用

フォーマット

arr.forEach(function (element,index,array) {
   console.log(element,index,array);
})

forEach方法は、着信関数

を自動的に呼び出します.

は、呼び出しごとに、現在巡回されている要素と、現在巡回されているインデックスと、現在巡回されている配列をこの関数

に伝達する.
2.forEach注意点

forEachは終了できません.スキップできません.

for inサイクル
1.for inサイクルの使用

let arr = ['god','gosh','jesus','christ'];
for(let key in arr){
   console.log(key); //      
   console.log(arr[key]); //     
}

2.for inサイクルの注意点

console.log(key);-->インデックスconsole.log(arr[key]);-->を取り出したのは、値

である.

for inサイクルエルゴードは、オブジェクト上のエニュメレーション属性(プロトタイプ上の属性を含む)すべての

Array.prototype.des = function(){
   return this[0];
};
let arr = ['god','gosh','jesus','christ'];
arr.title = 'words';
for(let key in arr){
   console.log(key); //      
   console.log(arr[key]); //     
}

である.

企業開発において、for inサイクルを推奨しないで、配列

を巡回します.

オブジェクトの属性は無秩序であり、for inサイクルは、無秩序なものを巡回するための専用

である.
for-i-nサイクルは、オブジェクトを遍歴するための専用のものです.オブジェクトの属性は無秩序です.だから、for-i-nサイクルは、順序のないものを遍歴するための専用のものです.したがって、for inサイクルを使用して、配列を巡回することは勧められません.
for ofサイクル
1.書式を使う

Array.prototype.des = function(){
   return this[0];
};
let arr = ['god','gosh','jesus','christ'];
arr.title = 'words';
for(let key of arr){
   console.log(key); //       
}

2.注意点

console.log(key);-->直接エルゴードされたのは値

である.

はプロトタイプの上の属性を遍歴しない

です.

は、ループの終了およびスキップをサポートする

.Object.keys()方法は属性名を巡回します.
属性名からなる配列1を返します.使い方

Object.keys()は、オブジェクトの属性名を1つの配列に配置する.配列の各要素タイプは、string

である.

配列の属性名の順列とfor...inループがオブジェクトを巡回したときに返される順序は一致します.

オブジェクトのキー値が列挙できない場合、キーからなる配列を返します.

オブジェクトを巡回中:

let object1 = {
    a: 'somestring',
    b: 42,
    c: false
};

console.log(Object.keys(object1));
// expected output: Array ["a", "b", "c"]

配列を巡回中:

// simple array
let arr = ['a', 'b', 'c'];
console.log(Object.keys(arr)); // console: ['0', '1', '2']
console.log(typeof Object.keys(arr)[0]); //string

巡回行列:

// array like object
let obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.keys(obj)); // console: ['0', '1', '2']

オブジェクトを巡回している場合は無秩序です.すなわち、上述した配列の属性名の順列と、for...inがオブジェクトを巡回しているときに返される順序は一致します.

// array like object with random key ordering
var anObj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.keys(anObj)); // console: ['2', '7', '100']

2.Object.keys()方法は、1つのオブジェクトが空利用Object.keys()方法で戻った配列であるかどうかを判断するために使用されてもよく、配列長が0であるかどうかを判断するために使用されてもよい.長さが0なら、そのオブジェクトは空です.逆に空ではない

let object1 = {
    a: 'somestring',
    b: 42,
    c: false
};
let keys = Object.keys(object1);
console.log(keys);
console.log(keys.length === 0); //false

Object.entries()メソッドを巡回しました.
は、キーの値を返します.配列は、for...inを使用してオブジェクトを巡回したときに返される順序と一致します.この方法はAray.prototype.entriesを検索して発見しました.私は使ったことがないです.ちょうど見つけただけで、いろいろなものを遍歴することができます.ついでに書いてきました.次の配列のentries()と比べて1.使い方を注意してください.

const obj = { foo: 'bar', baz: 42 };
console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]

巡回行列

// array like object
const obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]

オブジェクトを巡回中は無秩序です.

// array like object with random key ordering
const anObj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.entries(anObj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]

その他の遊び方

// non-object argument will be coerced to an object
console.log(Object.entries('foo')); // [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]

// iterate through key-value gracefully
const obj = { a: 5, b: 7, c: 9 };
for (const [key, value] of Object.entries(obj)) {
  console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
}

// Or, using array extras
Object.entries(obj).forEach(([key, value]) => {
console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
});

for ofサイクルの再検討
1.for ofサイクルは反復可能なオブジェクトを巡回するために使用できます.前のES 6文法記事でも反復可能なオブジェクトとは何かを言及しました.
イテレーションオブジェクトは、Iteratorインターフェースを展開するか、または定義されています.[Symbol.iterator]方法のデータ構造は、ES 6において、Iteratorインターフェースは主にfor of消費のために提供されている.
はい、弟の中弟がまた聞きました.何が[Symbol.iterator]ですか?ついでに参考リンクを入れてください.
aゼロargments function that returns an object,conforming to the iteratocol

一つのデータがIteratorインターフェースを実現している限り、このデータには[Symbol.iterator]という属性

があります.

[Symbol.iterator]の属性は、関数

を返します.

[Symbol.iterator]が戻ってきた関数が実行されると、新しいオブジェクトArray Iterator {}に戻り、オブジェクトのもう一つの名前がnextという方法(以下、説明する)

let arr = ['god','gosh','jesus','christ'];
let res = arr[Symbol.iterator];
console.log(res); //ƒ values() { [native code] }

let res2 = arr[Symbol.iterator]();
console.log(res2); //Array Iterator {}

が返される.
2.Array.prototype.entries()方法

entries()メソッドは、配列内の各インデックスのキー／値ペアを含む新しいAray Iteratorオブジェクトを返す.

arr.entries();およびarr[Symbol.iterator]();は、いずれも新たなAray Iteratorオブジェクトであり、両者の等価は

である.

let arr = ['god','gosh','jesus','christ'];
let res3 = arr.entries();
console.log(res3); //Array Iterator {}
for(let key of arr){
   console.log(key);
}

コンソール入力arr.entries()では、この新しいAray Iteratorオブジェクトを得るためには、この新しいArayサブエージェントオブジェクトは、そのプロトタイプ(Aray Iterator)上に、nextメソッドがあります.

next方法は実行するたびにオブジェクトに戻ります.done:false

このオブジェクトには、現在取り出されたデータと取り外されたかどうかのマークが格納されています.取り外されていないタグはfalseで、取り外されたマークはtrue

です.
4.for ofエルゴードarr.entries()を使用して、元の配列の各インデックスのキー/値ペアを同時に取得することができます.

let arr = ['god','gosh','jesus','christ'];
for(let key of arr.entries()){
   console.log(key);
}

5.もちろん、別々に書いて、別々に取ってもいいです.

let arr = ['god','gosh','jesus','christ'];
for(let key of arr.entries()){
   // console.log(key);
   console.log(key[0]); //    
   console.log(key[1]); //     
}

解構賦値を利用してキーパッドの処理ができます.後の操作ができます.

let arr = ['god','gosh','jesus','christ'];
for(let [index,value] of arr.entries()){
   // console.log(key);
   // console.log(key[0]); //    
   // console.log(key[1]); //     
   console.log((` ${index + 1}    ${value}`));
}

6.for ofサイクルは、Aray/Map/Set/String/TypedAray/argmentsオブジェクト/NodeListオブジェクトを使用することができる.したがって、巡回中にどのサイクルが使えるかを考える必要はなく、for ofはこれらのシーンを解決できます.for ofループはオブジェクトの巡回をサポートしていません.

function sum() {
    let count = 0;
    for (let key of arguments){
        count = count + key;
    }
    return count;
}
console.log(sum(1, 2, 3, 4, 5, 6, 7, 8));

ES 6に追加された文字列関数
starts With()
(加s、英語教師口調)starts Withメソッドは、現在の文字列が他の与えられたサブ文字列で始まるかどうかを判断し、判定結果に基づいてtrueまたはfalseに戻ります.1.用法str.startsWith(searchString\[, position\])

searchStringが検索するサブ文字列.

positionは、任意で、strにおいてsearch Stringの開始位置を検索し、デフォルト値が0、すなわち本当の文字列の先頭にある.

大文字と小文字は敏感です.

let str = 'significant';
console.log(str.startsWith('i', 4)); //          ，  true
console.log(str.startsWith('I', 4)); //     ，  false

endsWith()
現在の文字列が別の与えられたサブ文字列で「最後」であるかどうかを判断するために、endsWith()の方法で使用され、判定結果によってtrueまたはfalseに戻ります.1.用法str.endsWith(searchString\[, length\])

searchStringが検索するサブ文字列.

lengthはオプションです.strの長さとして.標準値はstr.lengthです.

大文字と小文字は敏感です.

let str = 'there are hunters';
console.log(str.endsWith('are', 9)); //          ，     are

includes()
(プラスします.英語の先生の口ぶり)includes()メソッドは、文字列が別の文字列に含まれているかどうかを判断します.場合によってはtrueまたはfalseに戻ります.1.用法str.includes(searchString[, position])

searchStringがこの文字列で検索する文字列.

positionはオプションです.現在の文字列のどのインデックス位置からサブ文字列を検索しますか?標準値は0です.

は、過去のindexOf()

の代わりに使用することができる.

let str = 'there are hunters';
console.log(str.indexOf('are') !== -1); //true
console.log(str.includes('are')); //true
console.log(str.includes('are',10)); //false
console.log(str.includes('hunters',10)); //true

repeat()
別名:人間の本質は複合機のrepeat方法repeat()で構成され、新しい文字列を返します.この文字列は接続された指定された数の文字列のコピーを含みます.1.使い方

countは、0と無限大の間の整数:[0,+∞]を意味します.新しい構造の文字列の中で、何度も元の文字列を繰り返したかを表します.

戻り値は、指定された文字列の指定された数のコピーを含む新しい文字列です.

/** 
 * str: String
 * count: Number
 */

let resultString = str.repeat(count);

2.注意点

重複回数は負ではいけません.

反復回数はinfinityより小さくなければならず、長さは最も長い文字列より大きくない.

3.例

"abc".repeat(-1)     // RangeError: repeat count must be positive and less than inifinity
"abc".repeat(0)      // ""
"abc".repeat(1)      // "abc"
"abc".repeat(2)      // "abcabc"
"abc".repeat(3.5)    // "abcabcabc"   count          .
"abc".repeat(1/0)    // RangeError: repeat count must be positive and less than inifinity

({toString : () => "abc", repeat : String.prototype.repeat}).repeat(2)   
//"abcabc",repeat       ,                   .

4.現場で教えています.例えば、ネットで面白い沙彫刻段を見たら、この方法を使ってたくさんの「はははは」を印刷できます.

let str = " ".repeat(10000);
console.log(str);

この記事の参考になるリンク:https://developer.mozilla.org/en-US/#

Text EnderとText DecoderはIEの下で互換性がない問題を解決します.