在javascript中有一个方便的语法实现反射,即for(...in...)语句,其语法是for(var p in obj){}这里的p表示声明了一个变量来存储obj对象的属性和方法,有了对象,属性或者方法可以用如下方式遍历:
for(var p in obj){
if(typeof(obj[p])=="function"){
obj[p]();
}else{
alert(obj[p]);
}
}
这段语句就遍历obj对象的所有属性和方法,如果遇到属性的话就弹出它的值,遇到方法就立即执行方法。
使用反射机制来传递样式参数:
在Ajax编程中,常常会用到动态的改变界面元素的样式,可以通过对象的style属性来改变如:
//要改变背景色为红色
element.style.backgroundColor="red";
其中style对象有很多属性,基本上CSS中的所有属性都可以在JavaScript中能够使用,现在考虑如果一个函数接收参数,用以指定一个界面元素的样式,那么就需要设计参数的实现方式,显然一个或者是几个参数是不能满足要求的,下面就是一种实现:
function setStyle(styleView){
var element = getElement();
element.style=styleView;
}
这样,直接将整个style对象作为参数传递进来了,一个style对象的可能形式可能是:
var style={
color:red,
backgroundColor:green,
borderwidth:2px
}
这时可以直接调用函数:
setStyle(style);
这中方式会出现一个问题:如果element原先就有一个样式,例如增经执行过:
element.style.height="20px";
而在styleView中没有对height的定义,因此element的height样式就丢失了,不是最初想要的结果,要解决这个问题,可以用反射机制来重写setStyle函数:
function setStyle(styleView){
var element = getElement();
for(var p in styleView){
element.style[p]=style[p];
}
}
程序中遍历styleView中的每个属性将其赋值给element的style对象,这样element中原先有个而在styleView中没有定义的属性也得到了保存,达到了预期的目的。