localStorageの値をループする方法

Question

私は、レシピ名と材料に書き込むReactアプリケーションを作成しており、作成された各レシピのページのリストとして表示されます。私は.mapを使ってリストアイテムを作成しようとしていましたが、それを処理するためには配列が必要ですが、localStorageは配列ではありません（私はとにかく信じています）。 localStorageの各キーを配列に移す方法がありますか？

localStorageは、「レシピを追加」ボタンを押すたびに、「レシピ名」のキーと注文のための番号を追加します。値はレシピ自体です。私は、レシピを配列にも.mapに追加したいだけです。

Answer 1

Object.keys(localStorage)を試してみてください。そのよう

var arrayOfKeys = Object.keys(localStorage); 

簡単：あなたはキーを要求されるように！これは一連のキーを返します。今、あなたが値をしたい場合：

var arrayOfValues = Object.values(localStorage); 

それは配列を返します。 Object.valuesは実験的なもので、その代わりになること

注：localStorage.lengthを使用することができます

var arrayOfValues = []; 
for(var i in localStorage){ 
    if(localStorage.hasOwnProperty(i)){ 
     arrayOfValues.push(localStorage[i]); 
    } 
} 

Answer 2

、それはlocalStorageに存在するキーの合計数を提供します。この長さを使用して繰り返し、次のようにキー名を取得するにはlocalStorage.key(index)を使用してください。

for (let i = 0; i < localStorage.length; i++)   
    let key = localStorage.key(i); 
    console.log(localStorage.getItem(key)); 
}