zl程序教程

您现在的位置是:首页 >  后端

当前栏目

js构造函数、索引数组和属性的实现方式和使用

JS属性索引数组 实现 使用 方式 构造函数
2023-06-13 09:15:30 时间
<script>
functionp(){
varlen=arguments.length;
for(vari=0;i<len;i++){
document.write(arguments[i]+"<br/>");
}

}
functionMyclass(x,y){
this.x=x;
this.y=y;
this.show=function(){
returnthis.x+this.y;
}
}
varm1=newMyclass(1,2);
varm2=newMyclass(3,4);
p(m1.show(),m2.show());
</script>

存在的问题
1.由于所有的实例都是复制了同一个方法所定义的实体,所以效率(内存效率与执行效率低下),可通过原型继承解决
2.无法对属性值进行访问控制(private,Public)可通过闭包解决
属性访问的运算对象不是变量而是对象的引用
仅读取数值的整数部分的处理
Math[this<0?"celling":"floor"](this);

关联数组
在js中必须通过对象才能实现关联数组
基本操作通过键取值,元素的设定,元素的删除

<script>
varmap={x:3,y:4};
p(map.x);
deletemap.x;//true
p(map.x);//undefined对不存在的元素进行访问结果是undefined,由于可以显示地将值设置为undefined,因此无法通过将值与undefined比较来判断值是否存在,可以通过forin进行枚举
a="undefined";
p(a);//undefined
p(typeofmap.x==a);//true
</script>

作为关联数组应该注意的点

<script>
functionMyclass(x,y){
this.x=x;
this.y=y;
}
Myclass.prototype.z=5;
varobj=newMyclass(1,2);
for(varkeyinobj){
p(key+":"+obj[key]);//会枚举出通过原型继承来的属性
}
//x:1y:2z:5
deleteobj.x;//true
p(obj.x);//undefined
p(obj.z);//5
//通过原型继承来的属性无法被delete删除
deleteobj.z;//true
p(obj.z);//5
//在将对象作为关联数组使用时,通常都会使用字面量来创建,即使视图通过使用空的对象字面量来创建一个没有元素的关联数组,也仍会从Object类中继承原型的属性
p("toString"inobj);//true
varobj1={};
p("toString"inobj1);//true
//通过forin枚举
p(obj1.length);//undefined
for(varkinobj1){
p(obj1[k]);
}
//没有元素被枚举出来这是由于enumerable属性的缘故
//通过hasOwnProperty来判断是本身的属性还是通过参与原型继承而来的属性
varmap={};
p(map.hasOwnProperty("toString"));//false
map["toString"]=1;
p(map.hasOwnProperty("toString"));//true
deletemap["toString"];
p(map.hasOwnProperty("toString"));//false
</script>

属性的属性

对象的属性也是有些属性的
如下表总结了在ECMAScript第五版定义了的属性,属性值被定为为值属性
表格1

属性的属性名

含义

writable

可以改写属性的值

enumerable

可以通过forin枚举出

configurable

可以改变属性的属性,可以删除属性

get

可以指定属性值的getter函数

set

可以指定属性值的setter函数

不可变对象
即生成之后状态不能再被改变的对象,字符串对象就是典型的不可变对象
灵活运用不可变对象可以提高程序的健壮性,比如在将传递给方法参数时,存在方法对对象内容的改写等
js中可通过以下方式实现不可变对象
1.将属性(状态隐藏藏),不提供变更操作(闭包实现)
2.灵活运用ECMAScript第五版提供的函数
3.灵活运用writable,configurable属性以及setter和getter
ECMAScript第五版中用于支持对象不可变的函数见下表格

方法名

属性新增

属性删除

属性值变更

确认方法

preventExtensions

x

o

o

Object.isExtensible

seal

x

x

o

Object.isSealed

freeze

x

x

x

Object.isFrozen

Object.preventExtensions例子

<script>
varobj={x:2,y:3};
Object.preventExtensions(obj);
//无法新增属性
obj.z=4;
p(Object.keys(obj));//x,y
//可以删除属性
deleteobj.y;
p(Object.keys(obj));//x
//可以更改属性值
obj.x=20;
p(obj.x);//20

//Object.seal例子将属性的configurable设置为假
varobj={x:2,y:3};
Object.seal(obj);
//无法新增也无法删除
obj.z=3;
p(Object.keys(obj));//x,y
deleteobj.x;//false
p(Object.keys(obj));//x,y
//可以改变属性值
obj.x=20;
p(obj.x);//20



//Object.freeze例子将属性的writable设置为假
varobj={x:2,y:3};
Object.freeze(obj);
//无法新增也无法删除,也无法改变属性值
obj.z=3;
p(Object.keys(obj));//x,y
deleteobj.x;
p(Object.keys(obj));//x,y
//可以改变属性值
obj.x=20;
p(obj.x);//20
</script>

需要注意
1.对于以上三种方法一旦更改就无法还原
2.如果想让原型继承中的被继承的方法也不可改变,需要对其进行显示操作