今天来讨论一下JS中的基本包装对象(也叫基本包装类型),之前刚学到这里的时候,自己也是一头雾水,不明白这个基本包装对象到底是个什么鬼,后来找了很多资料,终于看清了它的真面目。首先呢,我们现在复习一下JS的数据类型,JS数据类型被分为了两大门派,基本类型引用类型

基本类型:Undefined,Null,Boolean,Number,String

引用类型:Object,Array,Date,RegExp等,说白了就是对象。。。

我们都知道,引用类型有方法和属性,但是基本类型是木有的,但是你一定见过这样的代码

var str = 'hello'; //string 基本类型
var s2 = str.charAt(0);
alert(s2); // h

毫无疑问上面的string是一个基本类型,但是它却能召唤出一个charAt()的方法,这是什么原因呢?

主要是因为在基本类型中,有三个比较特殊的存在就是:String Number Boolean,这三个基本类型都有自己对应的包装对象。并且随时等候召唤。包装对象呢,其实就是对象,有相应的属性和方法。至于这个过程是怎么发生呢,其实是在后台偷偷发生的。

来看个栗子

//我们平常写程序的过程:
var str = 'hello'; //string 基本类型
var s2 = str.charAt(0); //在执行到这一句的时候 后台会自动完成以下动作 :

var str = new String('hello'); // 1 找到对应的包装对象类型,然后通过包装对象创建出一个和基本类型值相同的对象
var s2 = str.chaAt(0); // 2 然后这个对象就可以调用包装对象下的方法,并且返回结给s2.
str = null; // 3 之后这个临时创建的对象就被销毁了, str =null;

alert(s2);//h
alert(str);//hello 注意这是一瞬间的动作 实际上我们没有改变字符串本身的值。就是做了下面的动作.这也是为什么每个字符串具有的方法并没有改变字符串本身的原因。

由此我们可以知道,引用类型和基本包装对象的区别在于:生存期

引用类型所创建的对象,在执行的期间一直在内存中,而基本包装对象只是存在了一瞬间。

所以我们无法直接给基本类型添加方法:

举个栗子

var str = 'hello';
str.number = 10; //假设我们想给字符串添加一个属性number ,后台会有如下步骤

var str = new String('hello'); // 1 找到对应的包装对象类型,然后通过包装对象创建出一个和基本类型值相同的对象
str.number = 10; // 2 通过这个对象调用包装对象下的方法 但结果并没有被任何东西保存
str =null; // 3 这个对象又被销毁

alert(str.number); //undefined 当执行到这一句的时候,因为基本类型本来没有属性,后台又会重新重复上面的步骤

var str = new String('hello'); // 1 找到基本包装对象,然后又新开辟一个内存,创建一个值为hello对象
str.number = undefined // 2 因为包装对象下面没有number这个属性,所以又会重新添加,因为没有值,所以值是未定 ;然后弹出结果
str =null; // 3 这个对象又被销毁

那么我们怎么才能给基本类型添加方法或者属性呢?

答案是在基本包装对象的原型下面添加,每个对象都有原型。

来看个栗子

//给字符串添加方法  要写到对应的包装对象的原型下才行
var str = 'hello';
String.prototype.last= fuction(){
return this.charAt(this.length);
};
str.last(); // 5 执行到这一句,后台依然会偷偷的干这些事

var str = new String('hello');// 找到基本包装对象,new一个和字符串值相同的对象,
str.last(); // 通过这个对象找到了包装对象下的方法并调用
str =null; // 这个对象被销毁

看注释相信能看出创建在基本包装对象原型下面的方法和属性才能被保存。

关于基本包装对象就唠到这里了,希望大家都有所收获,一起学习,我是沐晴,一个随性洒脱的前端妹子,下篇不见不散。

轻松理解JS基本包装对象的更多相关文章

  1. 深入理解JS中的对象(二):new 的工作原理

    目录 序言 不同返回值的构造函数 深入 new 调用函数原理 总结 参考 1.序言 在 深入理解JS中的对象(一):原型.原型链和构造函数 中,我们分析了JS中是否一切皆对象以及对象的原型.原型链和构 ...

  2. 深入理解JS中的对象(三):class 的工作原理

    目录 序言 class 是一个特殊的函数 class 的工作原理 class 继承的原型链关系 参考 1.序言 ECMAScript 2015(ES6) 中引入的 JavaScript 类实质上是 J ...

  3. 深入理解JS中的对象(一)

    目录 一切皆是对象吗? 对象 原型与原型链 构造函数 参考 1.一切皆是对象吗? 首先,"在 JavaScript 中,一切皆是对象"这种表述是不完全正确的. JavaScript ...

  4. 【学习笔记】六:面向对象的程序设计——理解JS中的对象属性、创建对象、JS中的继承

    ES中没有类的概念,这也使其对象和其他语言中的对象有所不同,ES中定义对象为:“无序属性的集合,其属性包含基本值.对象或者函数”.现在常用的创建单个对象的方法为对象字面量形式.在常见多个对象时,使用工 ...

  5. 轻松理解JS中的面向对象,顺便搞懂prototype和__proto__

    这篇文章主要讲一下JS中面向对象以及 __proto__,ptototype和construcator,这几个概念都是相关的,所以一起讲了. 在讲这个之前我们先来说说类,了解面向对象的朋友应该都知道, ...

  6. Javascript中String()和new String()的区别——JS的包装对象

    最近在看Symbol不能使用new操作符,然后类比到Number,String,Boolean,因为它们同属于基本类型,但是有有所差异:Number,String,Boolean是可以使用new操作符 ...

  7. 轻松理解JS中的面向对象,顺便搞懂prototype和__proto__的原理介绍

    这篇文章主要讲一下JS中面向对象以及 __proto__,ptototype和construcator,这几个概念都是相关的,所以一起讲了. 在讲这个之前我们先来说说类,了解面向对象的朋友应该都知道, ...

  8. 为什么字符串会有length属性-JS中包装对象

    任何原始类型的数据  (primitive type) 比如 String类型的字符串 "abcd"   "abcd"  是原始类型的数据 但是 当他调用 le ...

  9. 两个实例轻松理解js函数预解析

    js函数预解析 例子1: 先上一段代码,看看能不能写出最终的执行结果. console.log(a); var a = 1; console.log(a); function a(){ console ...

随机推荐

  1. Erlang 进程被抢占的条件——一个进程长时霸占调度器的极端示例

    最近研究 binary 的实现和各种操作对应的 beam 虚拟机汇编指令,发现有一些指令序列是不可重入的,比如说有的指令构造一个上下文(也就是某种全局状态),然后下一条指令会对这个上下文做操作(具体的 ...

  2. LevelDB源码分析--使用Iterator简化代码设计

    我们先来参考来至使用Iterator简化代码2-TwoLevelIterator的例子,略微修改希望能帮助更加容易立即,如果有不理解请各位看客阅读原文. 下面我们再来看一个例子,我们为一个书店写程序, ...

  3. 深入剖析js命名空间函数namespace

    在看阿里员工写的开源数据库连接池的druid的源代码时,发现了其中在jquery的原代码中又定义了一个命名空间的函数:$.namespace(),其代码如下: 网址为:https://github.c ...

  4. Oracle数据库十大常见性能问题

    错误的连接管理 oracle的连接是耗时耗力的操作,不应像sqlserver那样使用连接 错误的使用游标和共享池 一般是没有使用绑定变量 不好的SQL语句 使用大量资源的SQL语句都应该好好检查是否可 ...

  5. 在Myeclipse中配置Maven

    第一步:下载maven安装包,配置环境变量M2_HOME;变量值为maven的解压目录. 第二步:在eclipse4.0之前的版本需要安装maven插件,方法即:将maven插件包复制到eclipse ...

  6. 2012年 蓝桥杯预赛 java 本科 题目

    2012年 蓝桥杯预赛 java 本科 考生须知: l  考试时间为4小时. l  参赛选手切勿修改机器自动生成的[考生文件夹]的名称或删除任何自动生成的文件或目录,否则会干扰考试系统正确采集您的解答 ...

  7. 烂泥:CentOS安装及配置TFTP服务器

    本文由秀依林枫提供友情赞助,首发于烂泥行天下. 为什么要学习有关TFTP服务器的安装及配置呢?主要是为了后续学习有关linux系统的无人值守安装做准备. TFTP简单文件传输协议,使用UDP的69端口 ...

  8. R语言与数据分析

    K最近邻(k-Nearest Neighbor,KNN)分类算法 R语言实现包:R语言中有kknn package实现了weighted k-nearest neighbor. 决策树: R语言实现决 ...

  9. 页面分享代码share

    在开发一个页面的时候常常会有这么一个小功能,就是分享该页面中的信息. 常见的分享代码有百度分享,JiaThis分享插件,bshare分享插件等,我主要分享一下自定义分享代码,如下: function ...

  10. Codeforces Round #253 Div2 D.Andrey and Problem 概率+贪心

    概率计算:P(某set) =  令:  和   现在考虑: 1.考虑某个集合,再加一个概率为Pi的朋友后能不能使总概率提高. 即: 由公式可知, 如果 S < 1,则delta > 0,则 ...