JavaScript服务器编程(对象属性枚举中应当避免原型污染问题)

前面文章中讨论了JS开发中对象属性枚举的ES3和ES5方案并给出了一组常用工具函数,其实,企业开发中真正应用时还存在不少问题。本文想基于前文进一步探讨一下有关原型污染的问题。由于JS的先天不足,有关原型污染背后隐藏着一个大的“故事”,以后我们的文章中还要涉及其中一些情节。

问题

前面在讨论使用in运算符检测对象中是否存在属性的方案,但是通过所举的示例也发现一个问题,例如:

console.log(‘"ID" in contacts: ‘,"ID" in contacts);

其输出结果也是true。这说明in运算符在属性检测时不仅搜索当前对象的自有属性,还会沿着对象的原型链搜索。

根据前面对于属性继承的分析可得知,JS中的对象总是以继承的方式工作,即使是一个空的对象字面量也会继承Object.prototype的大量属性。因此,对于下面的测试结果正在我们的意料之中:

var pol={};

console.log("Hi" in pol);  //false

console.log("toString" in pol);  //true

console.log("valueOf" in pol);  //true

console.log("constructor" in pol);  //true

console.log("__defineGetter__" in pol);  //true

console.log("__defineSetter__" in pol);  //true

console.log("__lookupGetter__" in pol);  //true

console.log("__lookupSetter__" in pol);  //true

console.log("hasOwnProperty" in pol);  //true

console.log("isPrototypeOf" in pol);  //true

console.log("propertyIsEnumerable" in pol);  //true

console.log("toLocaleString" in pol);  //true

而在ES5中使用Object.prototype中的hasOwnProperty方法正好可以避免上面的问题,因为它只检索对象的自有属性,包括不可枚举的属性(ES3中没有定义这样的概念)。

更进一步

如果对象本身有一个自有属性hasOwnProperty,情况又该如何呢?参考如下代码:

var o={};

o.hasOwnProperty="*********";

console.log(o.hasOwnProperty("Alice");

运行测试时,出现如下图所示的运行时错误:

对于这种情况,专家的建议是“最安全的方法是不做任何假设”。于是,我们可以提前在任何安全的位置提取出hasOwnProperty方法,同时利用立即执行的匿名函数的词法作用域特点,实现如下解决方案:

(function testOwnProperty(){

//var hasOwn=Object.prototype.hasOwnProperty;也可以使用如下更简洁方式

var hasOwn={}.hasOwnProperty;

var dict={};

dict.Alice=12;

console.log("------------");

console.log(hasOwn.call(dict,"hasOwnProperty"));

console.log(hasOwn.call(dict,"Alice"));

dict.hasOwnProperty=100;

console.log("-------------");

console.log(hasOwn.call(dict,"hasOwnProperty"));

console.log(hasOwn.call(dict,"Alice"));

console.log("---------------");

})();

于是,不管对象的hasOwnProperty方法是否被覆盖,上述方案都能够正常工作。值得注意的是,许多知名JS库就是利用了上述技术。

时间: 2024-10-17 03:19:40

JavaScript服务器编程(对象属性枚举中应当避免原型污染问题)的相关文章

高性能 javaScript 之遍历对象属性

在面向对象的开发工作中,经常会遇到检查对象属性和遍历对象属性的情况. JavaScript 不包含如 java.C 等语言的传统类继承模型,而是使用 prototype 原型模型. JavaScript 原型链继承中属性查找过程 当查找一个对象的属性时,JavaScript 会向上遍历原型链,直到找到给定名称的属性为止.到查找到达原型链的顶部 - 也就是 Object.prototype - 但是仍然没有找到指定的属性,就会返回 undefined. 使用 for in 循环可以遍历对象所有的属

ja对象属性—枚举、检查、删除

前言 我们经常需要操作对象的属性.这里记录ES5中操作对象属性的API和它们之间的差异. 枚举属性 for/in遍历对象中的所有可枚举属性(包括自有属性和继承属性) var obj = {name:"小花",age:18}; var obj2 = Object.create(obj); obj2.like = "骨头"; for(item in obj2){ // 将obj中的所有可枚举属性名以字符串形式分别赋值给itemtypeof item; => str

javascript 简单语法 对象属性及方法

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

对象属性的可枚举性

JavaScript中对象的属性分为两种:数据属性和访问器属性.然后根据具体的上下文环境的不同,又可以将属性分为:原型属性和实例属性.原型属性是定义在对象的原型(prototype)中的属性,而实例属性一方面来自构造的函数中,然后就是构造函数实例化后添加的新属性. 在JavaScript中除了检测对象的属性是否存在,还会经常对对象的属性进行遍历(枚举).而在JavaScript中遍历一个对象的属性并不太简单,主要有两个原因: JavaScript中的对象通常都处在某个原型链中,它会从一个或多个的

js 技巧 (六)JavaScript[对象.属性]集锦

JavaScript[对象.属性]集锦 SCRIPT 标记 用于包含javascript代码. 语法 属性 LANGUAGE 定义脚本语言 SRC 定义一个URL用以指定以.JS结尾的文件 windows对象 每个HTML文档的顶层对象. 属性 frames[] 子桢数组.每个子桢数组按源文档中定义的顺序存放. feames.length 子桢个数. self 当前窗口. parent 父窗口(当前窗口是中一个子窗口). top 顶层窗口(是所有可见窗口的父窗口). status 浏览器状态窗口

javascript 内置对象及常见API

javascript 内置对象及常见API 2012-09-02 15:17 571人阅读 评论(0) 收藏 举报 javascript正则表达式文档浏览器urlstring Javascript内置对象学习 全局属性 Infinity 表示正无穷大的数值 NaN 非数字值 undefined 未定义的值 decodeURI() 对encodeURI()转义的字符串解码. decodeURIComponent() 对encodeURIComponent()转义的字符串解码. encodeURI(

JavaScript语法之对象

今天总结一下关于对象的重点和容易理解不清的知识点. 1 JavaScript中主要有两种类型,即基本类型(包括string,number,boolean,null,undefined)和对象.而函数,数组,内置对象(String,Number,Boolean,Object,Function,Array,Date,RegExp,Error),这些都是对象的子类型(也可以叫复杂基本类型).也就是说它们也是对象的一种类型,具备一些额外的行为,比如函数可以理解为可调用的对象.因为函数是对象的一种子类型,

JavaScript服务器端开发技术(对象属性的枚举与查询)

既然对象是属性的集合,那么检测与枚举集合中的属性就是一项重要任务.对此,我们来分别看一下ES3和ES5提供的解决方案. 1)     ES3枚举方案 示例代码: var contacts={ ID:[0,1,2,3,4,5], names:["Zero","One","Two","Three","Four","Five"], addresses:[ { Street:"ABC&

javascript获取对象直接量中的属性和属性值

javascript获取对象直接量中的属性和属性值:所谓的对象直接量简单来说就是,由大括号包裹的键值对列表,例如: var antzone={ webName:"蚂蚁部落", address:"青岛市南区", age:2 } 下面介绍一下如何获取对象直接量中的属性和属性值,代码如下: var antzone={ webName:"蚂蚁部落", address:"青岛市南区", age:2 } for(var prop in a