资讯专栏INFORMATION COLUMN

轻松理解JS基本包装对象

seal_de / 2682人阅读

摘要:今天来讨论一下中的基本包装对象也叫基本包装类型,之前刚学到这里的时候,自己也是一头雾水,不明白这个基本包装对象到底是个什么鬼,后来找了很多资料,终于看清了它的真面目。基本类型引用类型等,说白了就是对象。。。

今天来讨论一下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; //  这个对象被销毁
}

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

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/102101.html

相关文章

  • JS中数据类型、内置对象包装类型对象、typeof关系

    摘要:平时在复习基础知识时,经常会遇到数据类型基础数据类型内置对象包装类型对象,检测数据类型时,用到的值,感觉都差不多,但是又有差异。值与数据类型关系对比下图,即可知值相较于基础数据类型少多 平时在复习JS基础知识时,经常会遇到JS数据类型、基础数据类型、内置对象、包装类型对象,检测数据类型时,用到的typeof值,感觉都差不多,但是又有差异。今天特地整理下,方便理解。 JS数据类型 基础数...

    OldPanda 评论0 收藏0
  • 前端知识点整理(待续)

    摘要:知识点闭包问题执行机制定时器线程理解构造函数内的方法与构造函数属性上方法的对比中都经历了什么深入理解中的属性和特性中的方法详解为什么编程语言的都要定义数据类型中与的区别轻松理解基本包装对象中数据类型内置对象包装类型对象关系基础之数组中的逻辑 JS知识点 JS hoist JS闭包问题 JS执行机制 JS定时器线程理解 构造函数内的方法与构造函数prototype属性上方法的对比 JS...

    silencezwm 评论0 收藏0
  • 面试知识点总结

    摘要:最近面试几家前端职位,想知道目前的前端面试题是偏向哪一块,都主要问到的是语法,闭包,原型链,继承那一块。并且将面试题的知识点汇总一下。参考网站面试题图片过多的时候如何优化图标很多的时候可以用雪碧图图片过大时候可以压缩一下。 最近面试几家前端职位,想知道目前的前端面试题是偏向哪一块,都主要问到的是ES6语法,闭包,原型链,继承那一块。并且将面试题的知识点汇总一下。有助于下次面试。 1.H...

    王晗 评论0 收藏0
  • 面试知识点总结

    摘要:最近面试几家前端职位,想知道目前的前端面试题是偏向哪一块,都主要问到的是语法,闭包,原型链,继承那一块。并且将面试题的知识点汇总一下。参考网站面试题图片过多的时候如何优化图标很多的时候可以用雪碧图图片过大时候可以压缩一下。 最近面试几家前端职位,想知道目前的前端面试题是偏向哪一块,都主要问到的是ES6语法,闭包,原型链,继承那一块。并且将面试题的知识点汇总一下。有助于下次面试。 1.H...

    CrazyCodes 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<