美文网首页微信小程序开发Android精选微信小程序
在微信小程序环境下,获取window对象

在微信小程序环境下,获取window对象

作者: _剪云者 | 来源:发表于2018-12-13 16:45 被阅读89次

    众所周知,微信小程序的js中不能使用window对象以及document对象
    难道他们真的不存在吗?事实并非如此。

    1、尝试获取window对象

    熟悉this的同学都知道,在浏览器环境下,触发一个立即执行函数时,其中this的指向往往都是window对象。

    var window = (function (){
       return this
    })();
    console.log(window); // Window {requestAnimationFrame: ƒ, cancelAnimationFrame: ƒ, atob: ƒ, setTimeout: ƒ, clearTimeout: ƒ, …}
    

    这段js在小程序中是同样有效的,所以window对象确实存在。
    window对象中包含了很多对象,如wx、Page、Component、Behavior等变量,你可以试试看。
    不过在严格模式下,this就指向了undefined。而且es6转es5时也默认开启了严格模式。

    'use strict';
    var window = (function (){
       return this
    })();
    console.log(window); //undefined
    

    2、尝试获取document、location等变量

    获取到了window对象,我们就可以获取其他全局变量

    (1)、location

    var window = (function (){
       return this
    })();
    console.log(window.location)
    
    location路径

    当我们js报错时,其路由前面部分是一样的,可见小程序的页面应该也是history模式路由管理的。


    页面报错

    (2)、document

    var window = (function (){
       return this
    })();
    console.log(window.document);
    

    在控制台中,我们可以看到微信小程序的html部分的源码。


    document对象

    3、模拟实现

    window.Page = function(){ //Page的源码};
    window.Component = function(){ //Component的源码};
    window.App = function(){//...};
    window.wx = {//...};
    //...等等
    window = undefined;
    

    在实际开发中我们可以利用这个方法,把一些全局方法给转移或清除掉,比如alert。

    var tempAlert = window.alert;
    window.alert = undefined;
    /* tempAlert 随你处置 */
    

    4、总结

    1、非严格模式下,可以获取window对象。
    2、可以在window中扩展自己的全局变量,当然并不推荐这样做。
    3、各种你能想到的操作...

    此文仅供交流,如有不当,请指正。

    相关文章

      网友评论

        本文标题:在微信小程序环境下,获取window对象

        本文链接:https://www.haomeiwen.com/subject/xglbhqtx.html