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 版本的文本输入框检查器Input Check
Jul 09 Javascript
javascript查找字符串中出现最多的字符和次数的小例子
Oct 29 Javascript
浅析Javascript中bind()方法的使用与实现
May 30 Javascript
针对后台列表table拖拽比较实用的jquery拖动排序
Oct 10 Javascript
AngularJS实现注册表单验证功能
Oct 16 Javascript
JavaScript基于面向对象实现的猜拳游戏
Jan 03 Javascript
使用vue2实现购物车和地址选配功能
Mar 29 Javascript
基于Vue2实现简易的省市区县三级联动组件效果
Nov 05 Javascript
JavaScript实现动态添加、移除元素或属性的方法分析
Jan 03 Javascript
解决vue打包后vendor.js文件过大问题
Jul 03 Javascript
layui表格 列自动适应大小失效的解决方法
Sep 06 Javascript
js实现星星海特效的示例
Sep 28 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
PHP4实际应用经验篇(9)
2006/10/09 PHP
一个可以删除字符串中HTML标记的PHP函数
2006/10/09 PHP
PHP从FLV文件获取视频预览图的方法
2015/03/12 PHP
Swoole-1.7.22 版本已发布,修复PHP7相关问题
2015/12/31 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
PHP Class SoapClient not found解决方法
2018/01/20 PHP
ECMAScript 创建自己的js类库
2012/11/22 Javascript
javascript SpiderMonkey中的函数序列化如何进行
2012/12/05 Javascript
jQuery弹出层始终垂直居中相对于屏幕或当前窗口
2013/04/01 Javascript
JS与jQ读取xml文件的方法
2015/12/08 Javascript
js实现拖拽效果(构造函数)
2015/12/14 Javascript
NodeJs的优势和适合开发的程序
2016/08/14 NodeJs
VUE axios发送跨域请求需要注意的问题
2017/07/06 Javascript
让Vue也可以使用Redux的方法
2018/05/23 Javascript
layui select获取自定义属性方法
2018/08/15 Javascript
在js代码拼接dom对象到页面上的模板总结
2018/10/21 Javascript
[01:28]2014DOTA2国际邀请赛中国区预选赛四大豪门直升机抵达会场
2014/05/24 DOTA
在Python中使用HTML模版的教程
2015/04/29 Python
Android应用开发中Action bar编写的入门教程
2016/02/26 Python
Python迭代器与生成器用法实例分析
2018/07/09 Python
python flask实现分页的示例代码
2018/08/02 Python
python操作excel让工作自动化
2019/08/09 Python
python try except返回异常的信息字符串代码实例
2019/08/15 Python
python list数据等间隔抽取并新建list存储的例子
2019/11/27 Python
馥绿德雅美国官方网站:Rene Furterer头皮护理专家
2019/05/01 全球购物
Lovedrobe官网:英国领先的大码服装品牌
2019/09/19 全球购物
main 主函数执行完毕后,是否可能会再执行一段代码,给出说明
2012/12/05 面试题
路政管理专业个人自荐信范文
2013/11/30 职场文书
财务人员个人求职信范文
2013/12/04 职场文书
酒店总经理欢迎词
2014/01/08 职场文书
事业单位公务员的职业生涯规划
2014/01/15 职场文书
法学专业求职信
2014/07/15 职场文书
综合素质评价个性发展自我评价
2015/03/06 职场文书
同学聚会开幕词
2019/04/02 职场文书
Python访问Redis的详细操作
2021/06/26 Python
动态规划之使用备忘录来改进Javascript函数
2022/04/07 Javascript