フロントエンドによくある配列とオブジェクトのエルゴード問題を簡単に話します.

フロントエンドはいろいろな状況があります.一番よく使うforサイクルのほかに、for in、for ofなどがあります.配列に対するmap遍歴、forEach遍歴があります.オブジェクトに対するObject.keys、object.valuesなどがあります.
1、forサイクル、for in、for ofの違いはどこですか?
配列を話して、栗を挙げます.

普通のforサイクルは、私たちの行列を遍歴することです.

for inは循環して、原型の上の属性と属性の値をすべて遍歴して下りてくることができて、遍歴したのはキーの名前です.

for ofサイクルは、配列内の各項目を遍歴するだけで、遍歴したキー名ではありません.

var arr = [1,2,3];
arr.a = 4；
Array.prototype.name = 'mapbar_front';
for(var i = 0; i < arr.length; i++){
    console.log(arr[i]);
}
//   for        1，2，3
for(var i in arr){
    console.log(arr[i]);
}
//for in        1，2，3，4，mapbar_front
for(var i of arr){
    console.log(i);//   i，   arr[i]
}
//       1，2，3；

それに相手の遍歴を話します.

オブジェクトは、forループに直接巡回できません.

オブジェクトのエルゴードはfor inサイクルが一般的ですが、for inループはプロトタイプの属性と方法をエルゴードします.

for ofは、オブジェクトを巡回することができません.

オブジェクト自体の属性と方法だけを遍歴したいなら、Object.hasOwnProperty()の方法で判断することができます.

Object.keys方法は、オブジェクトの属性を取得する方法であり、この方法では、プロトタイプの上の属性と方法のキーを取得しない.

var obj = {
    name: 'mapbar_front',
    age: 28,
}
Object.prototype.work = 'do work!';
for(var i in obj) {
    console.log(obj[i]);
}
var keylist = Object.keys(obj);
console.log(keylist);// ['name', 'age']

//hasOwnProperty   
console.log(obj.hasOwnProperty('name'));//true
console.log(obj.hasOwnProperty('work'));//false

2、行列遍歴の方法.forEach、map、filter、find、findIndex、includesの使用
任意の配列操作は、遍歴と切り離せませんが、需要が異なるため、すべての方法があります.
配列の各項目に対して、関数を実行するには、forEachの方法が必要かもしれません.

var arr = [1,2,3];
arr.forEach((item, index) => {
    console.log(item, index);
    //         。
})

配列に対して処理をしたいならば、処理後の配列を返します.map方法はあなたのほしいものかもしれません.

var arr = [1, 2, 3];
//      2，        
var newarr = arr.map((item, index) => {
    return item * 2;
})

配列に対して条件に合った項目を絞り込みたいなら、最終的に新しいフィルタをかけた後の配列が得られます.filter方法を使うかもしれません.

var arr = [1, 2, 3, 4];
var newarr = arr.filter((item, idx) => {
    return item % 2 === 0;
})

もしあなたが知りたいならば、私達の行列はある条件に合うものがありますか?それならsome方法を使うかもしれません.この方法の戻り値はブール値です.

var arr = [1, 2, 3, 4];
var isTrue = arr.some((item, idx) => {
    return item % 2 === 0;
})

some方法とfilter方法は、いずれも条件に合致しているかのように見えますが、filter方法は条件に合った一つ一つのpushを新しい配列に戻します.そして、someの方法は条件に合えば、trueを返してもいいです.
あなたの配列がどの条件に合っているかを確認したいなら、any方法を使うかもしれません.

var arr = [1, 2, 3, 4];
var isTrue = arr.any((item, idx) => {
    return item % 2 === 0;
})

行列に何かが含まれているかを知りたいなら、includes方法を使ってもいいです.

var arr = [1,2,3];
arr.includes(1);//true

もしあなたが知りたいなら、配列は条件に合うものを見つけることができますか?

var arr = [1, 2, 3];
var my = arr.find((item, index) => {
    return item === 2;
})

3、対象に関するAPIのまとめ.

Object.entriesは、キーペアの配列を返します.このキーペアも配列で配置されます.(Object.entriesはfor inのように、プロトタイプの上の属性と方法まで進んでいません)

var obj = {
    name: 'mapbar_front',
    age: 28,
    occupation: 'web fronted'
}
Object.entries(obj);//[["name","mapbar_front"], ["age", 28], ["occupation": "web fronted"]]

一般に、Object.entriesオブジェクトを介してMapデータ構造に変換することができる.

var obj = { name: 'mapbar_front', age: 27 };
var map = new Map(Object.entries(obj));

Object.keys及びObject.values方法の使用.オブジェクトにとっては、キーのリストを取得することが重要です.Object.keysを使ってオブジェクトのすべてのキー名を取得できます.戻り値はキーのリストです.彼らは同じように原型上の属性や方法を取得しません.

対象のvalueの集合だけがほしいなら、Object.valuesを使って解決します.

var obj = {
    name: 'mapbar_front',
    age: 28,
    occupation: 'web fronted'
}
console.log(Object.keys(obj));//["name", "age", "occupation"];
console.log(Object.values(obj));//["mapbar_front", 28, "web fronted"];

Object.getOwn PropertyNamesは、オブジェクトの属性名を取得し、列挙できない属性の属性名を含む.戻り値も行列です.

Object.getOwnPropertyNames(obj);
//["name", "age", "occupation", "sex"];

しかし、Object.getOwn PropertyNamesメソッドは、キータイプがstringタイプの属性しか取得できません.一般的には、属性のタイプもSymbolタイプであってもいいです.この場合は、Symbolタイプのキーを別のキーで取得する方法が必要です.

Object.getOwn PropertySymbolこの方法は、オブジェクトの属性キータイプがSymbolタイプのキー名を取得するために使用されます.Symbolタイプの配列を返します.また、列挙できない属性のキー名も取得できます.

var a = Symbol();
var obj = {
    name: 'mapbar_front',
    age: 28,
    occupation: 'web fronted',
    [a]: 1234,
}
Object.defineProperty(obj, 'sex', {
    value: 1,
    configurable: true,
    enumerable: true,
    writable: true
})
var symbol = Object.getOwnPropertySymbols(obj);
console.log(symbol);// [Symbol()]       
var names = Object.getOwnPropertyNames(obj);
console.log(names);

遍歴する時、対象の属性について、この属性は自分の実例的な属性か、それとも原型上の属性か、ObjectのAPIの中に、このようないくつかの方法があります.

Object.prototype.hasOwnPropertyは、オブジェクトの属性が自身に属するかどうかを判断するために使用されます.また、列挙できない属性が自分の対象であるかどうかを判断することもできます.

Object.prototype.isProttotypeOfは、オブジェクトが他のオブジェクトのプロトタイプチェーンの上にあるかどうかを判断するために使用されます.

function Foo(){}
function Bar(){}
Bar.prototype = Object.create(Foo.prototype);
var bar = new Bar();
Bar.prototype.isPrototypeOf(bar);//true。      Bar.prototype bar         。
Foo.prototype.isPrototypeOf(bar);//true。      Foo.prototype bar         。
Object.prototype.isPrototypeOf(bar);//true。   Object.prototype bar         。

時には、なぜオブジェクトの属性がfor inエルゴードされていないのか、このオブジェクトの属性は列挙できない可能性が高いと考えられます.以下の方法で処理します.

Object.prototype.propertyIs Enumberrableは、オブジェクトの属性が列挙可能かどうかを判断するために使用されます.

Object.getOwn PropertyDescriptor(O,property)は、オブジェクトOの記述対象であるDescriptr

を取得するために使用されます.
プロトタイプについては、オブジェクトに新しいプロトタイプを設定したり、オブジェクトが別のオブジェクトのプロトタイプチェーン上にあるかどうかを判断したいです.

Object.set ProttotypeOfは、オブジェクトのプロトタイプを設定するために使用されます.

Object.prototype.isProttotypeOfは、オブジェクトが他のオブジェクトのプロトタイプチェーンの上にあるかどうかを判断するために使用されます.

Object.createは、オブジェクトを作成し、このオブジェクトのプロトタイプはプロトを指します.

オブジェクトの操作に関しては、ある時には、オブジェクトに対して制限をしてもいいですか?例えば、オブジェクトに新しい属性を追加したくないです.あるいは、このオブジェクトは属性を削除できません.または、オブジェクトの属性値を変えられないです.このような操作は、対象に関する3つの方法を知る必要があります.

Object.prevent Extensions(O)/Object.isExtenssibleは、このオブジェクトが拡張されないことを保証し、isExtensioble関数はtrueまたはfalseを返し、このオブジェクトが拡張されるかどうかを示すために使用される.

Object.seal(O)/Object.isSealedは、オブジェクトが拡張されるだけでなく、オブジェクトの属性も自由に削除できないことを示しています.

Object.freeze(O)/Object.isFrozenは、オブジェクトが拡張されるだけではなく、属性も自由に削除できず、属性値も変更できないことを示しています.

var obj = {
    name: 'mapbar_front',
    age: 23
}
Object.preventExtensions(obj);//          
obj.name = 'mapbar';
obj.age1 = 1234;//         
console.log(obj);//{ name: 'mapbar', age: 23 }

var obj1 = {
    name: 'mapbar_front',
    age: 123
}
Object.seal(obj1);
delete obj1.name;
console.log(obj1);//  obj1     
console.log(Object.isSealed(obj1));//true

var obj2 = {
    name: 'mapbar_front',
    age: 123
}
Object.freeze(obj2);
obj2.name = '1111';
console.log(obj2);//  obj2   
console.log(Object.isFrozen(obj2));//true