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


Posted in Javascript onNovember 16, 2014
<script>
function p(){
 var len=arguments.length;
 for(var i=0;i<len;i++){
  document.write(arguments[i]+"<br/>");
 }
 
}
function Myclass(x,y){
 this.x=x;
 this.y=y;
 this.show=function(){
  return this.x+this.y;
 }
}
var m1=new Myclass(1,2);
var m2=new Myclass(3,4);
p(m1.show(),m2.show());
</script>

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

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

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

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

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

属性的属性

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

属性的属性名 含义
writable 可以改写属性的值
enumerable 可以通过for in枚举出
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>
var obj={x:2,y:3};
Object.preventExtensions(obj);
//无法新增属性
obj.z=4;
p(Object.keys(obj));//x,y
//可以删除属性
delete obj.y;
p(Object.keys(obj)); //x
//可以更改属性值
obj.x=20;
p(obj.x); //20

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



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

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

Javascript 相关文章推荐
ext checkboxgroup 回填数据解决
Aug 21 Javascript
jquery入门—访问DOM对象方法
Jan 07 Javascript
JavaScript实现为指定对象添加多个事件处理程序的方法
Apr 17 Javascript
JavaScript计算某一天是星期几的方法
Aug 05 Javascript
详解 javascript中offsetleft属性的用法
Nov 11 Javascript
js返回顶部实例分享
Dec 21 Javascript
一篇文章搞定JavaScript类型转换(面试常见)
Jan 21 Javascript
纯JS实现弹性导航条效果
Mar 06 Javascript
详解如何写出一个利于扩展的vue路由配置
May 16 Javascript
Javascript Dom元素获取和添加详解
Sep 24 Javascript
vue中实现弹出层动画效果的示例代码
Sep 25 Javascript
ElementUI实现el-form表单重置功能按钮
Jul 21 Javascript
JQuery表单验证插件EasyValidator用法分析
Nov 15 #Javascript
不到30行JS代码实现Excel表格的方法
Nov 15 #Javascript
Node.js中HTTP模块与事件模块详解
Nov 14 #Javascript
jquery中append()与appendto()用法分析
Nov 14 #Javascript
jQuery 插件开发指南
Nov 14 #Javascript
使用JavaScript和C#中获得referer
Nov 14 #Javascript
JavaScript window.location对象
Nov 14 #Javascript
You might like
用sql命令修改数据表中的一个字段为非空(not null)的语句
2010/06/04 PHP
Wordpress 相册插件 NextGEN-Gallery 添加目录将中文转为拼音的解决办法
2010/12/29 PHP
IIS安装Apache伪静态插件的具体操作图文
2013/07/01 PHP
PHP的一个完美GIF等比缩放类,附带去除缩放黑背景
2014/04/01 PHP
PHP实现支持SSL连接的SMTP邮件发送类
2015/03/05 PHP
浅析PHP中Session可能会引起并发问题
2015/07/23 PHP
浅谈PHPANALYSIS提取关键字
2019/03/08 PHP
PHP判断函数是否被定义的方法
2019/06/21 PHP
js控制页面控件隐藏显示的两种方法介绍
2013/10/09 Javascript
JS在可编辑的div中的光标位置插入内容的方法
2014/11/20 Javascript
JavaScript中神奇的call()方法
2015/03/12 Javascript
javascript无刷新评论实现方法
2015/05/13 Javascript
浅析JS动态创建元素【两种方法】
2016/04/20 Javascript
基于JS实现EOS隐藏错误提示层代码
2016/04/25 Javascript
js图片放大镜效果实现方法详解
2020/10/28 Javascript
Javascript ES6中数据类型Symbol的使用详解
2017/05/02 Javascript
vue 使用vue-i18n做全局中英文切换的方法
2018/10/29 Javascript
Angular处理未可知异常错误的方法详解
2021/01/17 Javascript
python求列表交集的方法汇总
2014/11/10 Python
详解python之简单主机批量管理工具
2017/01/27 Python
Python实现针对json中某个关键字段进行排序操作示例
2018/12/25 Python
windows下Python安装、使用教程和Notepad++的使用教程
2019/10/06 Python
Python使用Chrome插件实现爬虫过程图解
2020/06/09 Python
简单的命令查看安装的python版本号
2020/08/28 Python
详解python tkinter包获取本地绝对路径(以获取图片并展示)
2020/09/04 Python
10个示例带你掌握python中的元组
2020/11/23 Python
Python爬虫实战案例之爬取喜马拉雅音频数据详解
2020/12/07 Python
美国鞋类购物网站:Shiekh Shoes
2016/08/21 全球购物
Volcom法国官网:美国冲浪滑板品牌
2017/05/25 全球购物
摩托车和ATV零件、配件和服装的首选在线零售商:MotoSport
2017/12/22 全球购物
电子商务专业在校生实习自我鉴定
2013/09/29 职场文书
夜不归宿检讨书
2014/02/25 职场文书
买卖协议书范本
2014/04/21 职场文书
旷课检讨书
2015/01/26 职场文书
教师个人师德工作总结2015
2015/05/12 职场文书
2019最新校园运动会广播稿!
2019/06/28 职场文书