微信小程序开发Android精选微信小程序

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

2018-12-13  本文已影响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、各种你能想到的操作...

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

上一篇下一篇

猜你喜欢

热点阅读