es6 でオブジェクトと配列を走査するためのメソッドは何ですか
オブジェクトを走査するためのメソッド: 1. オブジェクト自身および継承された列挙可能なプロパティをループできる「for in」ステートメント; 2. Object.keys() および Object.values(); 3. Object .getOwnPropertyNames ()。配列を走査するためのメソッド: 1. forEach()、配列内の各要素の関数を呼び出すことができます; 2. map()、配列の各要素に対して指定されたコールバック関数を呼び出します; 3. filter(); 4 . 何か()など
このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 6、Dell G3 コンピューター。
私たちは仕事で配列またはオブジェクトのトラバーサルをよく使用します。for の問題点の 1 つは、追加の変数が定義されることです。for ループが多すぎると、変数が競合する傾向があります。 ES6 では新しいトラバーサル メソッドが提供されています。
オブジェクトのトラバース
1, for (let k in obj) {}
# を見てみましょう。
Properties (オブジェクト自身および継承された列挙可能なプロパティをループします (シンボル プロパティを除く)
let obj = {'0':'a','1':'b','2':'c'} for (let k in obj) { console.log(k+':'+obj[k]) } //0:a //1:b //2:c
2, Object.keys(obj)||
Object.values(obj)
array (
- Object.keys() メソッドは、指定されたオブジェクトの自己列挙可能なプロパティ、配列内の属性名の順序で構成される配列を返します。
- Object.values() メソッドは、指定されたオブジェクト自体の列挙可能なすべてのプロパティを返します 値の配列を同じ順序で返しますfor...in ループを使用する場合と同様 (違いは、for-in ループがプロトタイプ チェーン内のプロパティを列挙することです)。
let obj = {'0':'a','1':'b','2':'c'} console.log(Object.keys(obj)) //["0","1","2"] console.log(Object.values(obj)) //["a","b","c"]
3. Object .getOwnPropertyNames(obj)
let obj = {'0':'a','1':'b','2':'c'}; Object.getOwnPropertyNames(obj).forEach(function(key){ console.log(key,obj[key]); }); // 0 a // 1 b // 2 c
配列を走査します
1、arr.forEach#パラメータは匿名関数であることに注意してください。最初のパラメータは配列メンバーの値で、2 番目のパラメータはそのインデックスです。 {}
var name = ['张三', '李四', '王五']; ['张三', '李四', '王五'].forEach((v,l,k) => { console.log(v); console.log(l); console.log(k); })
k は、各配列メンバーのインデックス値です。
3、for(let k of arr){ }
は配列をサポートするだけでなく、ほとんどの配列のようなオブジェクト (疑似配列) もサポートします。 DOM NodeList オブジェクトなど。 は文字列トラバーサルもサポートしており、文字列をトラバーサル用の一連の Unicode 文字として扱います。
let arr = ['a','b','c','d'] for(let k in arr){ console.log(k,arr[k]) } // 0 a // 1 b // 2 c // 3 d
4.map(): map はマッピング、つまり 1 対 1 の対応を表します。トラバーサルが完了すると、新しい配列が返されますが、元の配列は変更されません。 5. filter()
フィルタリング、つまりフィルタという意味なので使い方let arr = ['a','b','c','d']
for(let k of arr){
console.log(k)
}
// a
// b
// c
// d
左から右にトラバースし、通常加算、減算、乗算、除算に使用されます var a1 = ['a', 'b', 'c'];
var a2 = a1.map(function(item,key,ary) {
return item.toUpperCase();
});
console.log(a1);// ['a','b','c'];
console.log(a2); //['A','B','C'];
7,すべて (および) 8、一部 (または)
var a1 = [1, 2, 3]; var total = a1.reduce(function(first, second) { return first + second; },0); console.log(total) // Prints 6 //注意 1、就是 return first+second 其实相当于 return first+=second; 也就是说每次的first 是上一次的和 //2、就是function{}后面的参数,如果 有值 那么第一次加载的时候 first = 0; second = 1; 如果没有值 , first = 1 , second = 2;如果后面的参数是个字符串,那么就是会是字符串拼接、
[関連する推奨事項: JavaScript ビデオ チュートリアル、ウェブフロントエンド]
以上がes6 でオブジェクトと配列を走査するためのメソッドは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック









ES6 では、配列オブジェクトの reverse() メソッドを使用して、配列の反転を実現できます。このメソッドは、配列内の要素の順序を逆にして、最後の要素を最初に、最初の要素を最後に配置するために使用されます。構文「array」 。逆行する()"。 reverse() メソッドは元の配列を変更します。変更したくない場合は、拡張演算子 "..." とともに使用する必要があり、構文は "[...array].reverse() 」。

非同期はes7です。 async と await は ES7 に新しく追加されたもので、非同期操作のソリューションです。async/await は co モジュールとジェネレーター関数の糖衣構文と言え、より明確なセマンティクスで JS 非同期コードを解決します。名前が示すように、async は「非同期」を意味します。async は関数が非同期であることを宣言するために使用されます。async と await の間には厳密な規則があります。両方を互いに分離することはできず、await は async 関数内でのみ記述できます。

手順: 1. 構文 "newA=new Set(a); newB=new Set(b);" を使用して、2 つの配列をそれぞれセット型に変換します; 2. has() と filter() を使用して差分セットを検索します、構文 " new Set([...newA].filter(x =>!newB.has(x)))" では、差分セット要素がセット コレクションに含まれて返されます。 3. 配列を使用します。 from セットを配列に変換するタイプ、構文は「Array.from(collection)」です。

ブラウザの互換性のため。 ES6 は JS の新しい仕様として、多くの新しい構文と API を追加していますが、最新のブラウザーは ES6 の新機能を高度にサポートしていないため、ES6 コードを ES5 コードに変換する必要があります。 WeChat Web 開発者ツールでは、デフォルトで babel が使用され、開発者の ES6 構文コードを 3 つの端末すべてで適切にサポートされる ES5 コードに変換し、開発者がさまざまな環境によって引き起こされる開発上の問題を解決できるようにします。プロジェクト内でのみ設定して確認するだけです。 「ES6~ES5」オプション。

es5 では、for ステートメントと IndexOf() 関数を使用して配列の重複排除を実現できます。構文 "for(i=0;i<配列長;i++){a=newArr.indexOf(arr[i]);if( a== -1){...}}」。 es6 では、スプレッド演算子 Array.from() および Set を使用して重複を削除できます。まず配列を Set オブジェクトに変換して重複を削除してから、スプレッド演算子または Array.from() 関数を使用する必要があります。 Set オブジェクトを配列に変換してグループ化するだけです。

es6 では、一時的なデッド ゾーンは構文エラーであり、ブロックを閉じたスコープにする let および const コマンドを指します。コード ブロック内では、let/const コマンドを使用して変数が宣言される前に、変数は使用できず、変数が宣言される前は変数の「デッド ゾーン」に属します。これは構文上「一時デッド ゾーン」と呼ばれます。 ES6 では、一時的なデッド ゾーンや let ステートメントや const ステートメントでは変数のプロモーションが発生しないことを規定しています。これは主に実行時エラーを減らし、変数が宣言される前に使用されて予期しない動作が発生するのを防ぐためです。

いいえ、require は CommonJS 仕様のモジュール構文であり、es6 仕様のモジュール構文は import です。 require は実行時にロードされ、import はコンパイル時にロードされます。require はコード内のどこにでも記述できます。import はファイルの先頭にのみ記述でき、条件文や関数スコープでは使用できません。モジュール属性は導入されるだけです。 require を実行した場合、そのためパフォーマンスは比較的低くなりますが、インポート コンパイル中に導入されたモジュールのプロパティのパフォーマンスはわずかに高くなります。

地図は注文済みです。 ES6 のマップ タイプは、多くのキーと値のペアを格納する順序付きリストです。キー名と対応する値はすべてのデータ型をサポートします。キー名の等価性は、「Objext.is()」メソッドを呼び出すことによって決定されます。 , したがって、数字の 5 と文字列「5」は 2 つのタイプとして判断され、プログラム内で 2 つの独立したキーとして現れることができます。
