push()在javascript中不起作用

push() not working in javascript

本文关键字:不起作用 javascript push      更新时间:2023-09-26

问题:控制台中的Uncaught TypeError: Object #<Object> has no method 'push'

代码在http://jsfiddle.net

更改存储项目id(Cart)并重试,看起来"Cart"id下以前存储的项目不是注释部分中建议的@dc5的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:"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;",
        BrandName:"General",
        ID:711
    };
    var item2 = {
        DepartmentID :123,
        CategoryID:321,
        BrandID:18,
        BrandImage:"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;",
        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;
}

表达式:

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的存在等,可以检测数组和类数组对象,以及在数组对象已被覆盖或跨iframe工作的情况下检测数组。


附加答案:

您已经对代码进行了大量更改,但问题仍然存在。线路:

if (items != null) {

不足以检查项是否为数组。你应该改为:

if ( items instanceof Array ) {

以确保它确实是一个数组。

此外,在其他块中:

}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,并在此处发布您的结果。问题出在浏览器上的本地存储上,通常无法在其他人的机器上复制。

是否进行

JSON.parse(localStorage.getItem(storageName)) 

总是返回一个数组?如果是这样的话,问题是并不是所有的浏览器都支持push方法。你可以添加使用这个片段添加它,如果它是丢失的:

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

这段代码只是一个开始,你肯定可以改进它

您可以使用。您可以使用call()在对象上调用Array.prototype.push()

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));
}

JSON.parse返回一个对象或null。所以在这里你不知道你有一个对象还是一个数组。

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

你可以用这个代替:

function appendToStorage(storageName, data){
    var oldStorage = JSON.parse(localStorage.getItem(storageName)) || {};
    if (oldStorage != null){
        $(oldStorage).extend(data);
        localStorage.setItem(storageName,JSON.stringify(oldStorage));
    } 
}

$extend()会将您的项目添加到另一个JSON对象中。此处信息

您的"item"不是一个数组,您不能对它使用推送方法。

对象没有"push"方法,可以这样做!

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