立即执行函数 pageshow

最新推荐文章于 2024-03-26 08:48:07 发布

原创最新推荐文章于 2024-03-26 08:48:07 发布 · 345 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #javascript #前端

javascript 专栏收录该内容

29 篇文章

订阅专栏

本文介绍了立即执行函数的概念，其用于创建独立作用域并处理命名冲突。同时，探讨了pageshow事件在解决火狐浏览器后退按钮不刷新问题的应用，以及如何利用它在页面从缓存加载时重新计算变量。

立即执行函数

立即执行函数：不需要调用，立马能够自己执行的函数

写法：
第一种:
(function(){

})()

第二种:
(function(){

}() )

      //第一种，较为常用
      //(function () {})()
      (function () {
        console.log(2);  //不需要调用，立马打印2  第二个函数可以看作是调用函数
      })();
      (function (a,b) {
        console.log(a+b);  //也可以传递参数进来
      })(1,2);
      //第二种，w3c的建议
      //(function () {}())
      (function (a,b) {
        console.log(a+b);  
      }(1,2));

立即执行函数最大的好处是独立创建了一个作用域，里面所有的变量都是局部变量，不会有命名冲突的影响

pageshow事件
以下三个情况都会刷新页面触发load事件

a标签的超链接
F5或者刷新按钮
前进或后退按钮
但，火狐浏览器有个“往返缓存”，这个缓存中不仅保留着页面数据，还保存了DOM 和 JS 的状态，实际上是将整个页面都保存在了内存里。

所以此时后退按钮也不能刷新按钮。

此时可以用pageshow 事件来触发，这个事件在页面显示时触发，无论页面是否来自缓存，在重新加载页面中，pageshow会在load事件触发后触发，根据时间对象的persisted来判断是否是缓存中的页面触发的pageshow事件，注意，这个事件给window 添加

//e.persieted 返回的是True 就是说如果这个页面是从缓存取过来的页面，也需要重新计算一下rem 的大小