关键词:
Why
研究一个网站前端技术的时候,了解它的全局的对象是一个好的入口,
一般来说,常见的库就会用外观模式,最后暴露一个对象给用户调用,
比如jQuery,requirejs,angular,react
均是用这种方式。
如果没有用cmd/amd模块化或类似webpack工具打包的话,会给全局对象window添加一个属性,如angular:
如React
同时,为了避免全局污染,也要关注全局变量的个数和详情。
How
可以通过ES5的新增api(Object.keys)看浏览器全局变量列表:Object.keys(window)
发现一般的网站都有两百多个全局变量,人力去看且需要区分是否是用户定义的比较困难,需要一个script
去列出所有的非原生的全局属性.
开始想的是能不能防篡改对象的相关检测api(Object.isExtensible,Object.isSealed,Object.isFrozen)来判断是否原生api?
但并不是所有的原生对象都是seaded. 所以此方法行不通。
那么能不能有一个纯净的、没有加载第三方库的全局对象?
对于浏览器环境,我们有iframe
可以添加一个iframe,然后对比当前的window,就可以得到详细列表。
var iframe = document.createElement("iframe");
document.body.appendChild(iframe);
Object.keys(iframe.contentWindow).length
列出非原来对象
(function(){
var iframe = document.createElement("iframe");
document.body.appendChild(iframe);
var originWindow=iframe.contentWindow,
currentWindow=window
var origin =Object.keys(originWindow),
current =Object.keys(currentWindow),
extendAttr={};
current.forEach((key)=>{
if(originWindow[key]===undefined){
extendAttr[key]=currentWindow[key]
};
})
console.log(`origin window:${origin.length},current window:${current.length},extentAttr:${Object.keys(extendAttr).length}`)
console.log("extendAttr:",extendAttr);
document.body.removeChild(iframe);
})();
cnblogs的全局对象:
Node怎么处理
由于node没有像Chrome Dev Tools Console一样的工具,可以直观简单的执行js代码片段,
对于Nodejs,可以在应用运行稳定(所有的全局,单例对象都初始化完成)后,再导出全局对象,
再在同一环境,不导入任何库导出全局对象,进行对比即可。
怎么知道一个原生函数有没有覆盖
由于Function.prototype.toString
API,对原生函数返回[native code]
setTimeout.toString()
"function setTimeout() { [native code] }"
但对于自定义的函数会返回源码:
jQuery.toString()
"function (e,t){return new x.fn.init(e,t,r)}"
angular就是利用这一特性实现依赖注入http://www.cnblogs.com/etoah/p/5460441.html
可以用此特性,来检测是否是原生的api(仅适用于浏览器运行环境,node环境有差异).
一个原生属性(Object,string...)怎么检测有没有被用户重置,除了用typeof
检测数据类型, 本人暂没有更好的方案,欢迎讨论。
javascript如何列出全局对象的非原生属性。
Why研究一个网站前端技术的时候,了解它的全局的对象是一个好的入口,一般来说,常见的库就会用外观模式,最后暴露一个对象给用户调用,比如jQuery,requirejs,angular,react均是用这种方式。如果没有用cmd/amd模块化或类似webpack工... 查看详情
如何列出 JavaScript 对象的属性?
】如何列出JavaScript对象的属性?【英文标题】:HowtolistthepropertiesofaJavaScriptobject?【发布时间】:2010-09-1712:08:09【问题描述】:假设我这样创建了一个对象:varmyObject="ircEvent":"PRIVMSG","method":"newURI","regex":"^http://.*";检索属性名称列... 查看详情
JavaScript:在 IE 中列出全局变量
】JavaScript:在IE中列出全局变量【英文标题】:JavaScript:ListglobalvariablesinIE【发布时间】:2010-03-1712:37:40【问题描述】:我正在尝试获取我的班级的实例名称。我这样做的方法是遍历所有全局对象并将其与this指针进行比较。它适... 查看详情
如何列出 javascript 对象的函数/方法? (这甚至可能吗?)
】如何列出javascript对象的函数/方法?(这甚至可能吗?)【英文标题】:Howtolistthefunctions/methodsofajavascriptobject?(Isitevenpossible?)【发布时间】:2011-05-2004:11:33【问题描述】:故意将这个问题表述为thisquestion。我什至不知道这是否... 查看详情
读书笔记-javascript中的全局对象
对于任何JavaScript程序,当程序开始运行时,JavaScript解释器都会初始化一个全局对象以供程序使用。这个JavaScript自身提供的全局对象的功能包括:1.全局对象拥有一些常用的属性值。比如undefined、Infinity以及NaN。2.全局对象拥有一... 查看详情
javascript原生对象属性和方法详解——array对象
http://www.feeldesignstudio.com/2013/09/native-javascript-object-properties-and-methods-array/length设置或返回数组中元素的数目。注意:设置length属性可改变数组的大小。如果设置的值比其当前值小,数组将被截断,其尾部的元素将丢失。如果设置... 查看详情
javascript中的全局对象,内置对象和预定义对象是啥?
RT1.全局对象是预定义的对象,作为 JavaScript 的全局函数和全局属性的占位符。 通过使用全局对象,可以访问所有其他所有预定义的对象、函数和属性。 全局对象不是任何对象的属性,所以它没有名称。2.内部对象是编写... 查看详情
javascript全局对象---常用
1.顶层函数(全局函数)1)isNaN()函数用于检查其参数是否是非数字值。-----isNaN(x) x是必须参数,如果x是特殊的非数字值NaN(或者能被转换为这样的值),返回的值就是true。如果x是其他值,则返回false。2)Number()函数... 查看详情
html事件属性
...在浏览器中触发动作的能力,比如当用户点击元素时启动JavaScript。如需学习更多有关事件编程的知识,请访问我们的JavaScript教程。下面列出了添加到HTML元素以定义事件动作的全局事件属性。=HTML5中新的事件属性。Window事件属性... 查看详情
html事件属性
...在浏览器中触发动作的能力,比如当用户点击元素时启动JavaScript。如需学习更多有关事件编程的知识,请访问我们的JavaScript教程。下面列出了添加到HTML元素以定义事件动作的全局事件属性。=HTML5中新的事件属性。Window事件属性... 查看详情
全局对象
定义: 全局对象(globalobject)在JavaScript中有着重要的用途,全局对象的属性是全局定义的符号,JavaScript可以直接使用,比如:全局属性undefined,infinity和NaN全局函数isNaN(),parseINt(),eval())构造函数Date(),RegExp()... 查看详情
原生javascript对象的方法
createObject.create()方法创建一个拥有指定原型和若干个指定属性的对象。Object.create(proto[,propertiesObject])proto为新创建对象的原型对象,设置为null可创建没有原型的空对象。propertiesObject包涵若干个属性的描述符和defineProperties的第二... 查看详情
javascript全局属性/函数
JavaScript全局属性和方法可用于创建Javascript对象。JavaScript全局属性属性描述Infinity代表正的无穷大的数值。NaN指示某个值是不是数字值。undefined指示未定义的值。JavaScript全局函数函数描述decodeURI()解码某个编码的URI。decodeURICompone... 查看详情
javascript中15种原生对象类型系统综述
...1.数据类型:能够表示并操作的值的类型称作数据类型2.javascript的类型系统:原生对象、宿主对象、浏览器拓展对象;二.一张图看懂javascript的原生对象类型关系三 javascript15种原生对象的分类补充:在单体内置对象中忽略了... 查看详情
如果显示错误为“试图获取非对象的属性”,如何识别代码中的非对象?
】如果显示错误为“试图获取非对象的属性”,如何识别代码中的非对象?【英文标题】:howtoidentifywhichisanon-objectinthecodeifitshowserroras`tryingtogetpropertyofnon-object`?【发布时间】:2017-01-2223:56:21【问题描述】:对现有脚本进行一些修... 查看详情
如何在 VS 命令窗口中列出 JavaScript 对象的方法?
】如何在VS命令窗口中列出JavaScript对象的方法?【英文标题】:HowcanIlistthemethodsofaJavaScriptobjectinVScommandwindow?【发布时间】:2010-09-1902:46:22【问题描述】:在VisualStudio2008中调试JavaScript时,我使用?命令窗口中的命令列出JavaScript对... 查看详情
javascript全局对象
JavaScript全局对象全局属性和函数可用于所有内建的JavaScript对象。顶层函数(全局函数)函数描述decodeURI()解码某个编码的URI。decodeURIComponent()解码一个编码的URI组件。encodeURI()把字符串编码为URI。encodeURIComponent()把字符串编码为UR... 查看详情
javascript正则表达式三
正则表达式对象的方法:test用于测试字符串参数中是否存在匹配正则表达式模式的字符串,如果存在返回true,不存在返回false。exec使用正则表达式模式对字符串执行搜索,并将更新全局RegExp对象的属性以反映匹配结果。如果没... 查看详情