JS，将数组数据保存在 sessionStorage 中的问题

Question

这是有问题的代码：

let newFriend = event.target.id;
let friends;
if (sessionStorage.getItem('friends') === null || sessionStorage.getItem('friends') === undefined || sessionStorage.getItem('friends') === '') {
    console.log('DEV_NO FRIENDS!sessionStorage[\'friends\']: ' + sessionStorage.getItem('friends'));
    friends = [newFriend];
} else {
    let currentFriends = sessionStorage.getItem('friends').split(',');
    console.log(currentFriends.length);
    // let currentFriends = JSON.parse(sessionStorage.getItem('friends'));
    console.log('DEV_sessionStorage friends: ' + currentFriends);
    console.log('DEV_inArray condition: ' + $.inArray(newFriend, currentFriends));
    if (!($.inArray(newFriend, currentFriends) !== -1)) {
        console.log('DEV_if not in array!');
        friends = currentFriends.push(newFriend);
        console.log('DEV_friends in if: ' + friends);
    }
}
let data = {friends: friends};

它挂在图像标签上。 sessionStorage 在成功登录时填充，如下所示：

if (response['friends'] !== undefined) {
    sessionStorage.setItem('friends', response['friends']);
} else {
    sessionStorage.removeItem('friends');
}

或者是这样更新，如果有新朋友加入：

ajax(url, 'GET', 'none', 'Kinvey', function(response) {
    sessionStorage.setItem('friends', response['friends']);
});

想法是：用户可以将朋友添加到他的朋友列表中。朋友 'PUT' 进入了我的应用程序的后端，在一个名为 'friends' 的列中。然后更新 sessionStorage 以存储新朋友。据我所知，sessionStorage 仅支持字符串，因此我认为让我们将朋友存储为字符串，以“,”分隔。然后我会选择它 ('currentFriends') 并将该字符串拆分为数组。然后推送下一项并将数据发送回服务器，然后更新sessionStorage。但我就是做不到——我已经尝试了 3 个多小时了。正如您在众多 console.log() 中看到的那样，出于某种原因，我无法相应地处理我的数据，而且我不知道我做错了什么。很抱歉 post，但我真的被困在这里..

底线： 正如@dfasoro 亲切地解释的那样——在使用 REST 时，应该始终确保他将数据保存在 JSON 字符串中。我的第二个问题是 array.push() returns 整数（数组长度）而不是新数组。

Answer 1

希望这对您有所帮助，我已经帮助您重构了代码并删除了不必要的内容，希望内联注释也能对您有所帮助。

图像挂钩代码

let newFriend = event.target.id;
let friends = [];
if (sessionStorage.getItem('friends')) {
    try {
        //this will throw an error if invalid array json is in friends sessionStorage
        friends = JSON.parse(sessionStorage.getItem('friends'));
    }
    catch (e) { }
}

//is friend in the array?
//if not add and store back into sessionStorage
if (friends.indexOf(newFriend) == -1) {
    friends.push(newFriend);
    sessionStorage.setItem('friends', JSON.stringify(friends));
}

let data = {friends: friends};
//continue with your image hook code

登录码

//login code
if (response['friends']) {
    sessionStorage.setItem('friends', JSON.stringify(response['friends']));
} else {
    sessionStorage.removeItem('friends');
}

输入代码

//update PUT code
ajax(url, 'GET', 'none', 'Kinvey', function(response) {
    sessionStorage.setItem('friends', JSON.stringify(response['friends']));
});

您基本上将数据存储为 JSON 字符串并检索为 JSON 对象。您也不需要 null、undefined、empty 测试等。您基本上是在尝试测试虚假值。我也真的希望您的响应对象是映射到朋友数组的标准 JSON 对象，而不是逗号分隔的朋友列表，例如 {"friends": [4, 5, 3, 2]} 而不是`{"friends": "4, 5, 3, 2"}"

Answer 2

上面的工作非常完美，因为 sessionStorage 只使用键值对。

虽然我也用sessionJS到get/set/delete数据to/fromsessionStorage 也许这对你也有帮助。

JS，将数组数据保存在 sessionStorage 中的问题

JS, issue with keeping array data in sessionStorage

javascript

arrays

split

session-storage