JS的localStorage和sessionStorage的用法

sessionStorage（临时存储）：为每个数据源维持一个存储区域，在浏览器打开期间存在，包括页面重新加载

localStorage（长期存储）：浏览器关闭后，数据依然会一直存在

*引用类型的值要转换成JSON

1、保存数据到本地存储：

const userInfo = {

    name: '管管',

   age: 18,

};

sessionStorage.setItem('userInfo', JSON.stringify(userInfo));

localStorage.setItem('userInfo', JSON.stringify(userInfo));

2、获取本地存储的数据：

var data1 = JSON .parse(sessionStorage.getItem( 'userInfo' ));  

var data2 = JSON .parse(localStorage.getItem( 'userInfo' ));

3、删除本地存储中的某条数据：

sessionStorage.removeItem( 'userInfo' );

localStorage.removeItem( 'userInfo' );

4、清空本地存储：

sessionStorage.clear();

localStorage.clear();

5、监听本地存储的变化：

*storage发生变化（增删改）时的触发，同一个页面发生的改变不会触发，只会监听同一域名下其他页面改变storage

window.addEventListener( 'storage' , function (e) {      

    console.log( 'key' , e.key);

    console.log( 'oldValue' , e.oldValue);

    console.log( 'newValue' , e.newValue);

    console.log( 'url' , e.url);

})