localStorage里面保存函数如何执行

表白：黑白圣堂血天使，天剑鬼刀阿修罗。 
讲解对象：/localStorage里面保存函数如何执行
作者：融水公子 rsgz
===

知道我 上一篇文章写的这个函数保存到localStorage里面成功的取出来了吧？

如果我改成这样子 执行函数

var myFunc = function() {
  console.log("Hello, world!");
};

var funcString = myFunc.toString();  // 'function() {\n  console.log("Hello, world!");\n}'
localStorage.setItem('rsgz001',funcString)
rsgz=localStorage.getItem('rsgz001');  // 'function() {\n  console.log("Hello, world!");\n}'

大家能想到的方式有这几种

rsgz()
eval(rsgz)
eval('(' + rsgz + ')');
eval('(' + rsgz + ')')();
var rsgz3 = new Function(rsgz);rsgz3();

事实上只有 这一种方式调用成功了

eval('(' + rsgz + ')')();

下面我给大家解释一下为什么

localStorage 中保存的是一个字符串，而不是一个函数。因此，需要将字符串转换为可执行的函数，才能够执行它。

1 rsgz()：这种方式会报错，因为 rsgz 是一个字符串，不能够直接执行。

2 eval(rsgz)：这种方式也会报错，因为 eval() 函数需要传入一个字符串，而不是一个函数对象。

3 eval('(' + rsgz + ')')：这种方式可以将字符串转换为函数对象，但是不能够直接执行函数。需要在后面加上 () 才能够执行。

4 eval('(' + rsgz + ')')()：这种方式可以正确执行函数。

5 var rsgz3 = new Function(rsgz); rsgz3() 这第五种本来是可以用的 但是函数转化为字符串的时候由于多了一个字符串'function()' 把这个去掉就可以用了

var rsgz3 = new Function(rsgz); rsgz3()：这种方式也可以将字符串转换为函数对象，并且可以正确执行函数。注意，使用 new Function() 构造函数也存在一定的安全风险，因为它可以执行任意的 JavaScript 代码。

但是上面第五种大家需要改写一下 才能用

var funcString = '{\n  console.log("Hello, world!");\n}'
localStorage.setItem('rsgz001',funcString)
rsgz=localStorage.getItem('rsgz001');  // '{\n  console.log("Hello, world!");\n}'
new Function(rsgz)();

到底使用第四种还是第五种 主要取决于你要保存到本地的那个函数是什么状态，如果是函数状态那就用第四种，如果是字符串状态那就去掉前面的function() 然后采用第五种也可以的

条条大路通罗马！！！！

再来一个进阶例子，你学了将函数保存到localStorage 总得有用武之地吧？哈哈哈
在新打开的页面继续执行代码 
=== 

公众号：不浪仙人

谢谢大家的支持！可以点击我的头像，进入我的空间浏览更多文章呢。建议大家360doc[www.360doc.com]注册一个账号登录，里面真的有很多优秀的文章，欢迎大家的到来。
---