JavaScript包装对象使用详解


Posted in Javascript onJuly 09, 2015

JavaScript对象是一种复合值:它是属性和已命名值的集合。通过"."符号来引用属性值。当属性值是一个函数时,称为方法。

①一段你常用但却未必明白其真正底层原理的代码:

var s = "hello world!";
var word = s.substring(s.indexOf(" ")+1,s.length);

如前面所说,这里变量s只是一个字符串原始类型,它怎么会有属性(s.length)和方法(s.indexOf()、s.substring())呢?没错,这正跟我们正要介绍的包装对象有关。原因是:只要引用了字符串s的属性,JavaScript就会将字符串值通过调用new String(s)的方式转换成对象,这个对象继承了字符串(String)对象的方法,并被用来处理属性的引用。一旦属性引用结束,这个新创建的对象就会被销毁。

同字符串一样,数字和布尔值也有各自的方法:通过Number()和Boolean()构造函数创建一个临时对象。存取字符串、数字或布尔值的属性时创建的临时对象就是包装对象。5种原始类型中的剩余两种null和undefined没有包装对象:访问它们的属性会造成一个类型错误(Uncaught TypeError)。明白了上面的代码,那么再看如下代码:

var s = "test";
s.len = 4;//给它设置一个属性
var t = s.len;

不认真的同学这里就会认为最后t就是等于4了。难道最后t不等于4吗?是的,最后t的值是undefined。想知道为什么请看继续看解析:原来以这里第二行代码只是创建了一个临时字符串对象,并给len属性赋值为4,随即销毁这个对象。而第三行又是通过原始字符串s创建一个新字符串对象(这个不是第二行代码创建的对象,第二行代码创建的对象已经被销毁了)并尝试读取其len属相,这个属性自然不存在,因此表达式的结果为undefined。这段代码说明了在读取字符串、数字和布尔值的属性值或方法(实际上是它们对应包装对象的属性值或方法)表现的像对象一样。但如果你试图给属性赋值,则会忽略这个操作:修改只是发生在临时对象身上,而这个临时对象并不会继续保留下来。

注意:可通过String(),Number(),Boolean()构造函数来显示创建包装对象:

var s = "test",n=1,b=true;//一个字符串、数字和布尔值
var S = new String(s);//一个字符串对象
var N = new Number(n);//一个数值对象
var B = new Boolean(b);//一个布尔对象

JavaScript会在必要时将包装对象转换成原始值,因此上段代码中的对象S、N和B常常但不总是表现的和值s、n和b一样。"=="等于运算符将原始值和其包装对象视为相等,但“===”全等运算将它们视为不等。通过typeof运算符也可以看到原始值和其包装对象的不同:

①typeof(s);
->"string"


 typeof(S);
->"object"


②typeof(n);
->"string"


 typeof(N);
->"object"


③typeof(b);
->"string"


 typeof(B);
->"object"

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
基于jQuery的合并表格中相同文本的相邻单元格的代码
Apr 06 Javascript
JavaScript将页面表格导出为Excel的具体实现
Dec 27 Javascript
javascript实现复选框超过限制即弹出警告框的方法
Feb 25 Javascript
JavaScript数组前面插入元素的方法
Apr 06 Javascript
zepto中使用swipe.js制作轮播图附swipeUp,swipeDown不起效果问题
Aug 27 Javascript
jQuery easyui刷新当前tabs的方法
Sep 23 Javascript
利用jQuery实现简单的拖曳效果实例代码
Oct 20 jQuery
详解puppeteer使用代理
Dec 27 Javascript
微信小程序 setData 对 data数据影响问题
Apr 18 Javascript
JS实现简单的文字无缝上下滚动功能示例
Jun 22 Javascript
Vue+Node实现商品列表的分页、排序、筛选,添加购物车功能详解
Dec 07 Javascript
用Javascript实现发送短信验证码间隔功能
Feb 08 Javascript
jquery实现表单验证并阻止非法提交
Jul 09 #Javascript
jQuery实现tab选项卡效果的方法
Jul 08 #Javascript
jQuery实现类似淘宝网图片放大效果的方法
Jul 08 #Javascript
javascript实现10个球随机运动、碰撞实例详解
Jul 08 #Javascript
详细分析JavaScript变量类型
Jul 08 #Javascript
js实现图片点击左右轮播
Jul 08 #Javascript
javascript获取重复次数最多的字符
Jul 08 #Javascript
You might like
无线电广播的开始
2002/01/30 无线电
把从SQL中取出的数据转化成XMl格式
2006/10/09 PHP
PHP小教程之实现链表
2014/06/09 PHP
php在apache环境下实现gzip配置方法
2015/04/02 PHP
php实现对两个数组进行减法操作的方法
2015/04/17 PHP
php利用gd库为图片添加水印
2016/11/09 PHP
PHP基于timestamp和nonce实现的防止重放攻击方案分析
2019/07/26 PHP
JS array 数组详解
2009/03/22 Javascript
js更优雅的兼容
2010/08/12 Javascript
js操作textarea 常用方法总结
2012/12/03 Javascript
JS调用页面表格导出excel示例代码
2014/03/18 Javascript
学习JavaScript设计模式(继承)
2015/11/26 Javascript
js Canvas绘制圆形时钟效果
2017/02/17 Javascript
日期时间范围选择插件:daterangepicker使用总结(必看篇)
2017/09/14 Javascript
vue.js2.0 实现better-scroll的滚动效果实例详解
2018/08/13 Javascript
JavaScript 点击触发复制功能实例详解
2018/11/02 Javascript
JQuery模拟实现网页中自定义鼠标右键菜单功能
2018/11/14 jQuery
JavaScript实现随机五位数验证码
2019/09/27 Javascript
JavaScript实现抖音罗盘时钟
2019/10/11 Javascript
[00:23]DOTA2群星共贺开放测试 25日无码时代来袭
2013/09/23 DOTA
Python中的descriptor描述器简明使用指南
2016/06/02 Python
Python 从列表中取值和取索引的方法
2018/12/25 Python
Python Socket TCP双端聊天功能实现过程详解
2020/06/15 Python
Python自动化操作实现图例绘制
2020/07/09 Python
使用python批量修改XML文件中图像的depth值
2020/07/22 Python
CSS3 @keyframes简单动画实现
2018/02/24 HTML / CSS
美国护肤咨询及美容产品电商:Askderm
2017/02/24 全球购物
台湾时尚彩瞳专门店:imeime
2019/08/16 全球购物
英国豪华家具和经典家居饰品购物网站:OKA
2020/06/05 全球购物
数控加工专业毕业生自荐信
2013/09/27 职场文书
保送生自荐信范文
2013/10/06 职场文书
就业表自我评价分享
2014/02/06 职场文书
党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
2015年酒店工作总结范文
2015/04/07 职场文书
教师节座谈会主持词
2015/07/03 职场文书