8种机械键盘轴体对比
本人程序员，要买一个写代码的键盘，请问红轴和茶轴怎么选？
概述
使用 HTML5 可以在本地存储用户的浏览数据。
数据以 键/值 对存在, web网页的数据只允许该网页访问使用。
浏览器支持
Internet Explorer 8+，Firefox，Opera，Chrome，和 Safari支持Web 存储
注意: Internet Explorer 7 及更早IE版本不支持web 存储。
存储方式
HTML5支持两种存储方式：localStorage: 没有时间限制的数据存储
sessionStorage: 针对一个 session 的数据存储
localStorage 对象
localStorage 对象存储的数据没有时间限制。第二天、第二周或下一年之后，数据依然可用。
sessionStorage 对象
sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。
区别
localStorage 与 sessionStorage 的声明周期不同。
sessionStorage 会在浏览器关闭或用户清理缓存时生命结束，
localStorage 只有在用户清理缓存时生命结束。
API
localStorage 与 sessionStorage 都是 storage 对象，它们的 API 一样。
setItem()
setItem() 作为 Storage 接口的方法，接受一个键名和值作为参数，将会把键名添加到存储中，如果键名已存在，则更新其对应的值。
语法：storage.setItem(keyName, keyValue);
示例：
function (){
localStorage.setItem('bgcolor', 'red');
localStorage.setItem('font', 'Helvetica');
localStorage.setItem('image', 'myCat.png');
}
getItem()getItem() 作为 Storage 接口的方法，接受一个键名(key name)作为参数，并返回对应键名的值(key's value)。
语法:var aValue = storage.getItem(keyName);
示例：
var currentColor = localStorage.getItem('bgcolor');
var currentFont = localStorage.getItem('font');
var currentImage = localStorage.getItem('image');
key()key() 作为 Storage 接口的方法，接受一个数值 n 作为参数，返回存储对象第 n 个数据项的键名。
语法：var aKeyName = storage.key(key);
示例：
function (){
localStorage.setItem('bgcolor', 'yellow');
localStorage.setItem('font', 'Helvetica');
localStorage.setItem('image', 'cats.png');
localStorage.key(2);
}
removeItem()Storage 接口的 removeItem() 方法，接受一个键名作为参数，会把该键名从存储中移除。
语法：storage.removeItem(keyName);
示例：
function (){
localStorage.setItem('bgcolor', 'red');
localStorage.setItem('font', 'Helvetica');
localStorage.setItem('image', 'myCat.png');
localStorage.removeItem('image');
}
clear()clear() 是 Storage 接口的一个方法，调用它可以清空存储对象里所有的键值。
语法:storage.clear();
示例：1localStorage.clear();
length
length 是 Storage 接口的只读属性，返回一个整数，表示存储在 Storage 对象里的数据项(data items)数量。
语法：var aLength = storage.length;
示例：
function (){
localStorage.setItem('bgcolor', 'yellow');
localStorage.setItem('font', 'Helvetica');
localStorage.setItem('image', 'cats.png');
localStorage.length; // 返回 3
}实际上
localStorage 是一个对象，当你直接输出 localStorage 的时候，就可以看到它的存储方式。
所以，localStorage 可以使用所有 Object 的方法。
console.log(localStorage);
/*
Storage {
bgcolor: "yellow",
font: "Helvetica",
image: "cats.png",
length: 3
}
*/
console.log(Object.keys(localStorage));
// ["bgcolor", "font", "image"]可以把它当成普通对象一样使用：
(不过这样不友好，不建议)
console.log(localStorage.bgcolor);
// yellow
console.log(localStorage.getItem('bgcolor'));
// yellow
localStorage.bgcolor = 'blue';
console.log(localStorage.getItem('bgcolor'));
// blue
localStorage.setItem('bgcolor', 'green');
// green提升
HTML5的本地存储都是只能存储 String 类型的数据，任何其他类型都会转成字符串存储。
例如：
localStorage.setItem('user', {
name: 'xiaoming',
age: 20,
});
localStorage.setItem('age', 20);
localStorage.getItem('user'); // '[object Object]'
localStorage.getItem('age'); // '20'为了解决这些问题，最实在的方式是利用 JSON 进行序列化：
把对象序列化成字符串：
// 序列化
var user = JSON.stringify({
name: 'xiaoming',
age: 20,
});
// '{"name":"xiaoming","age":20}'
localStorage.setItem('user', user);
localStorage.getItem('user');
// '{"name":"xiaoming","age":20}'
// 反序列化
var _user = JSON.parse(
localStorage.getItem('user')
);
// { name: 'xiaoming', age: 20 }
