javascript - push() が JavaScript で機能しない

Question

問題 :Uncaught TypeError: Object #<Object> has no method 'push'コンソールで。

http://jsfiddle.netのコード

Answer 1

ストレージアイテムID（カート）を変更して再試行してください。コメントセクションで@dc5が提案したように、「カート」IDの下に以前に保存されたアイテムはjson配列ではありません

UPD：これを試してくださいhttp://jsfiddle.net/vJkBQ/4/

HTML

<div id='cart'></div>
<input type="button" id="add" value="Add To Cart item 1" />
<input type="button" id="add2" value="Add To Cart item 2" />

Javascript

//TODO: move from globals
var storageName = 'myCART';

$(document).ready(function () {
    var item = {
        DepartmentID :333,
        CategoryID:117,
        BrandID:19,
        BrandImage:"         ",
        BrandName:"General",
        ID:711
    };
    var item2 = {
        DepartmentID :123,
        CategoryID:321,
        BrandID:18,
        BrandImage:"         ",
        BrandName:"Common",
        ID:712
    };

    localStorage.clear(storageName);
    $('#add').click(function(){
       addToCart(item);
    });

    $('#add2').click(function(){
       addToCart(item2);
    });
});

function addToCart(item){
    //by @slebetman   
    var items = JSON.parse(localStorage.getItem(storageName));
    if (! (items instanceof Array) ) {
        items = [];
    }

    var itemIndex = getItemIndexById(items, item.ID);    
    if(typeof(itemIndex) === 'number'){
        items[itemIndex].quantity++;
    }
    else{
        item.quantity = 1;
        items.push(item);
    }

    localStorage.setItem(storageName, JSON.stringify(items));
    console.log(localStorage.getItem(storageName));
}

//find search item index
function getItemIndexById(items, id){
    for(var i = 0; i < items.length; i++){
        if(items[i].ID == id){
            return i;
        }
    }

    return false;
}

Answer 2

表現：

JSON.parse(localStorage.getItem(storageName))

ほとんどの場合、配列は返されません。その場合、ステートメント:

var oldStorage = JSON.parse(localStorage.getItem(storageName)) || [];

では不十分です。

代わりにすべきことは、次のようなものです。

var oldStorage = JSON.parse(localStorage.getItem(storageName));
if (! (oldStorage instanceof Array) ) {
    oldStorage = [];
}

これは配列を検出する簡単な方法です。.length配列や配列のようなオブジェクトを検出したり、Array オブジェクトが上書きされたり、iframe 間で機能する場合に配列を検出したりするなどの存在をチェックするなど、より高度な方法があります。

---

追加の回答:

コードを大幅に変更しましたが、問題は同じです。この線：

if (items != null) {

items が配列であることを確認するには不十分です。代わりに次のことを行う必要があります。

if ( items instanceof Array ) {

本当に配列であることを確認します。

また、else ブロックで:

}else{
    console.log('Cart is empty, preparing new cart array');
    items.push(item);

このconsole.logメッセージは、新しいアレイが準備されていることを示しています。ただし、コードは新しい配列を初期化せず、items変数を配列であるかのように使用するため、嘘をつきます。代わりにこれを行う必要があります：

}else{
    console.log('Cart is empty, preparing new cart array');
    items = [];
    items.push(item);

---

警告：

しかし、結局のところ、私の質問に対するコメント投稿者に注意してください。私がアドバイスしたことを実行するよりも、このすべてをゼロから作成した場合、すべての問題が解決します。しかし、あなたが行っていることが他の誰かのコードを変更することである場合、それCartはあなたが期待したものとは異なる形式で保存された可能性があります.

console.log(localStorage['Cart'])電話をかける前にJSON.parse、結果をここに投稿してください。問題はブラウザのローカル ストレージにあり、通常、他の人のマシンでは再現できません。

Answer 3

する

JSON.parse(localStorage.getItem(storageName)) 

常に配列を返しますか? その場合、問題はすべてのブラウザーがプッシュ方式をサポートしていないことです。欠落している場合は、このスニペットを使用して追加できます。

if(!Array.prototype.push){
    Array.prototype.push=function(x){
        this[this.length]=x;
        return true
    }
};

このコードはほんの始まりにすぎません。間違いなく改善できます

Answer 4

Array.prototype.push()を使用してオブジェクトを呼び出すことができますcall()。

JSFiddle

JavaScript

function appendToStorage(storageName, data){
    var oldStorage = JSON.parse(localStorage.getItem(storageName)) || [];
    Array.prototype.push.call(oldStorage, data);
    localStorage.setItem(storageName,JSON.stringify(oldStorage));
}

Answer 5

あなたの「アイテム」は配列ではなく、プッシュメソッドを使用することはできません。