深入理解JavaScript中为什么string可以拥有方法


Posted in Javascript onMay 24, 2016

引子

我们都知道,JavaScript数据类型分两大类,基本类型(或者称原始类型)和引用类型。

基本类型的值是保存在栈内存中的简单数据段,它们是按值访问的。JS中有五种基本类型:Undefined、Null、Boolean、Number和String。

引用类型的值是保存在堆内存中的对象,它的值是按引用访问的。引用类型主要有Object、Array、Function、RegExp、Date。

对象是拥有属性和方法的,所以我们看到下面这段代码一点也不奇怪.

var favs=['鸡蛋','莲蓬'];
favs.push('秋葵');
console.log(favs);//["鸡蛋", "莲蓬", "秋葵"]
console.log(favs.length);//3

Array是引用类型,所以它自然可以拥有属性(length)和方法(push),这天经地义地就像夏天一定要吃冰淇淋一样。但是,再看下面的代码,仔细想想,这这这,合法吗?

var realMessage="Said I love you but I lied";
var myMessage=realMessage.substring(5,15);
console.log(myMessage); //"I love you"

有一个心碎的女纸任性地对一个用来分手的字符串任性地执行了“substring”方法,然后开心地看着剪辑版睡过去了。可是可是可是,不是说string是基本类型吗,为什么它可以拥有方法??还有没有王法啊青天大老爷!

其实,这一切,都是因为有个叫“基本包装类型”的东东。这个基本包装类型特别耿直,是真正的“事了拂衣去,深藏功与名”!

基本包装类型

除了一开始提到的Object、Array等引用类型,JavaScript还为我们提供了三种特殊的引用类型:String、Number和Boolean,方便我们操作对应的基本类型。

继续看上面的剪辑字符串的例子,有没有注意到,尽管使用了substring方法,realMessage本身的值是不会变的,调用这个方法只是返回了一个新的字符串。

这就是基本包装类型的作用了。本来你是没有方法的,但是你想用方法的时候,你尽管调,对应的基本包装类型有这个方法就行。例如上面的substring方法,string这个基本类型是不可能有这个方法的,但是String这个包装类型有啊,它会吭吭哧哧地把这个方法执行完把结果返回。在执行到:

realMessage.substring(5,15)这行代码时,发生了很多事。

首先,它会从内存中读取realMessage的值。当处于这种读取模式下的时候,后台就开始干活了。JS高程是这样描述后台完成的这些动作的:

1.创建String类型的一个实例;

2.在实例上调用指定的方法;

3.销毁这个实例

上面的例子可以用这样的代码来说明:

var _realMessage=new String("Said I love you but I lied");
var myMessage=_realMessage.substring(5,15);
_realMessgae=null; //方法调用后即销毁

所以,这样我们就明白了,并不是基本类型string执行了自身方法,而是后台为它创建了一个对应的基本包装类型String,它根据基本类型的值实例化出了一个实例,让这个实例去调用指定方法,最后销毁自己,感天动地有木有。

注意最后一步基本包装类型“会销毁”的特性,这决定了我们不能为基本类型值添加自定义属性和方法。

var me="sunjing";
me.age=18;
console.log(me.age);//undefined

我给“me“这个字符串添加了age属性,值设为美好的18岁,然并卵,再次访问时,这个属性已经渺无踪迹了。这是因为:

执行到第二行代码属性赋值时,后台创建了一个基本包装类型的实例,这个age属性确实挂到实例上去了,但是紧跟着,这个实例就被销毁了。执行到第三行时,又重新创建了新的基本包装类型的实例,自然是没有age属性的。

显示使用基本包装类型

除了在字符串处于读取模式下,后台会帮我们创建基本包装类型实例时,我们自己也可以显示地创建。

var str=new String("hello");
var str2=str.toUpperCase();
console.log(str2);//"HELLO:

这样与后台帮我们创建时变量中保存的东西是不同的。

var str1=new String("hello");
var str2="hello";
typeof str1 //"object"
typeof str2 //"string"

总结

多亏了有基本包装类型,我们操作string、boolean、number这三种基本类型更方便了。每当读取这三种基本类型值时,后台会创建对应的包装类型实例,这个实例会调用指定方法,调用完会被销毁。这种短暂的生命周期决定了我们不能为基本类型添加自定义的属性和方法。

以上这篇深入理解JavaScript中为什么string可以拥有方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js/jQuery对象互转(快速操作dom元素)
Feb 04 Javascript
javascript操作excel生成报表示例
May 08 Javascript
jQuery对象与DOM对象转换方法详解
May 10 Javascript
微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义实例
Dec 08 Javascript
vue iview组件表格 render函数的使用方法详解
Mar 15 Javascript
Webpack 之 babel-loader文件预处理器详解
Mar 23 Javascript
vue移动端微信授权登录插件封装的实例
Aug 28 Javascript
如何基于JavaScript判断图片是否加载完成
Dec 28 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
Apr 17 Javascript
浅谈JS for循环中使用break和continue的区别
Jul 21 Javascript
Vant picker 多级联动操作
Nov 02 Javascript
JavaScript实现九宫格拖拽效果
Jun 28 Javascript
jQuery height()、innerHeight()、outerHeight()函数的区别详解
May 23 #Javascript
JavaScript程序中的流程控制语句用法总结
May 23 #Javascript
Node.js服务器环境下使用Mock.js拦截AJAX请求的教程
May 23 #Javascript
谈一谈bootstrap响应式布局
May 23 #Javascript
JavaScript实现复制或剪切内容到剪贴板功能的方法
May 23 #Javascript
JavaScript的Vue.js库入门学习教程
May 23 #Javascript
详解JavaScript中|单竖杠运算符的使用方法
May 23 #Javascript
You might like
PHP 获取客户端真实IP地址多种方法小结
2010/05/15 PHP
CI框架开发新浪微博登录接口源码完整版
2014/05/28 PHP
fsockopen pfsockopen函数被禁用,SMTP发送邮件不正常的解决方法
2015/09/20 PHP
PHP入门教程之上传文件实例详解
2016/09/11 PHP
Js+XML 操作
2006/09/20 Javascript
浅谈Javascript Base64 加密解密
2014/12/28 Javascript
JS+CSS实现Div弹出窗口同时背景变暗的方法
2015/03/04 Javascript
jquery实现很酷的网页顶部图标下拉菜单效果
2015/08/22 Javascript
jQuery定义插件的方法
2015/12/18 Javascript
探讨跨域请求资源的几种方式(总结)
2016/12/02 Javascript
微信小程序 两种滑动方式(横向滑动,竖向滑动)详细及实例代码
2017/01/13 Javascript
vue购物车插件编写代码
2017/11/27 Javascript
JS函数节流和函数防抖问题分析
2017/12/18 Javascript
JS/jQuery实现DIV延时几秒后消失或显示的方法
2018/02/12 jQuery
js中console在一行内打印字符串和对象的方法
2019/09/10 Javascript
javascript设计模式 ? 桥接模式原理与应用实例分析
2020/04/13 Javascript
快速解决Vue、element-ui的resetFields()方法重置表单无效的问题
2020/08/12 Javascript
tensorflow 使用flags定义命令行参数的方法
2018/04/23 Python
用python生成1000个txt文件的方法
2018/10/25 Python
python中使用you-get库批量在线下载bilibili视频的教程
2020/03/10 Python
浅析rem和em和px vh vw和% 移动端长度单位
2016/04/28 HTML / CSS
浅谈CSS3特性查询(Feature Query: @supports)功能简介
2017/07/31 HTML / CSS
美国瑜伽品牌:Gaiam
2017/10/31 全球购物
莫斯科隐形眼镜网上商店:Linzi
2019/07/22 全球购物
公司综合部的成员自我评价分享
2013/11/05 职场文书
二年级语文教学反思
2014/02/02 职场文书
冰淇淋店的创业计划书
2014/02/07 职场文书
小学“向国旗敬礼”网上签名寄语活动总结
2014/09/27 职场文书
搞笑的爱情检讨书
2014/10/01 职场文书
法院干警四风问题个人对照检查材料思想汇报
2014/10/07 职场文书
作文评语怎么写
2014/12/25 职场文书
检讨书范文2000字
2015/01/28 职场文书
国庆放假通知怎么写
2015/07/30 职场文书
2016护理专业求职自荐书
2016/01/28 职场文书
2019经典广告词集锦!
2019/07/02 职场文书
某某店铺的开业庆典主持词范本
2019/11/25 职场文书