老师帮我加一下注释。希望老师通俗的解释。嘿嘿把理解不了

<!DOCTYPE html>
<html manifest="" style="font-size:16px">
<head>
<title>练习</title>
<meta charset="UTF-8">
</head>
<body>

<!-- JS -->

<script type="text/javascript">
// 严格模式
'use strict';
// 自执行匿名函数
( function () {
// 保存 localStorage 对象
var ls = window.localStorage;
// 储存报错返回函数
function oops(){
return console.warn("储存报错了。")
}
// cacheStorage 获取数据 函数
function getItem(key){

// 获取 localStorage 中的数据
var data = ls.getItem(key);

// data 数据 转换为对象
data = JSON.parse(data) || {};

//  time 如何来的 老师
if( data.time === 0) {

//返回 数据中value的值
return data.value;
// 判断 是否过期 // 老师详细讲解一下原理
} else if( Date.now() > data.time) {
//时间超出删除当前值
ls.removeItem(key);
} else {
// 为空返回"" 否则返回 data.value
return typeof data.value !== "undefined" ? data.value : "";
}


}

function setItem(key,value,time){
if( typeof key === "undefined") return

var data = {
time : time ? Date.now() + time : 0,
value : value,
}

data = JSON.stringify(data);

try {

ls.setItem(key,data);
} catch {

ls.clear();
ls.setItem( key, data);
}

}

function removeItem(key){

ls.removeItem(key);
}

function clear(){

ls.clear();
}

window.cacheStorage = {
getItem : ls ? getItem : oops,
setItem : ls ? setItem : oops,
removeItem : ls ? removeItem : oops,
clear : ls  ? clear : clear,
}

})()
</script>
</body>
</html>

慕神6715844 2018-12-02

源自：HTML5存储 2-5 存储实现打怪小案例

收起

4回答

好帮手慕星星回答被采纳获得+3积分 2018-12-03 12:01:21

这段代码的原理是，将上面定义的方法添加到window的一个属性中，调用的时候通过属性调用即可。

每一个三元运算的意思是：浏览器是否支持localstorage，如果支持，就调用自己定义的方法；如果不支持，就调用oops方法提示警告。

收起回答

慕神6715844 提问者 #1

奥，那老师关于兼容浏览器的方法这段代码如何写那？嘿嘿麻烦老师了。

2018-12-03 12:46:42
慕神6715844 提问者 #2

我还一直纠结这段话很没意义，原来兼容写法。。。

2018-12-03 12:47:07

好帮手慕星星 2018-12-03 09:57:35

这个三元表达式的意思是：在设置数据时，如果传入了time参数，数据保存的time就是当前时间+传入的时间。假如传入time的为1000，意思就是数据在1000毫秒，也就是1秒之后过期，使用getItem就获取不到了。

如果没有传入参数time，那么默认time为0。如下：

自己可以测试下。

收起回答

提问者慕神6715844 #1

window.cacheStorage = { getItem : ls ? getItem : oops, setItem : ls ? setItem : oops, removeItem : ls ? removeItem : oops, clear : ls ? clear : clear, } 上面那一句今早上理解了，就是没有time没有参数布尔值为假，就是0。那这些三元是啥意思？老师原理是什么？不是老师直接跟我说答案?嘿嘿，我想知道思维，

2018-12-03 10:25:39

提问者慕神6715844 2018-12-02 15:36:05

var data = {
	// 老师我的理解： 假如time :(=) 1000 ? Date.new() + 1000 : 0;
	//  直接 time : 1000,不可以吗？  我是不是理解错了嘿嘿
	ime : time ? Date.now() + time : 0,
	value : value,
}

收起回答