原生函数

原生函数,即JavaScript的内建函数(built-in function)。常用的原生函数有String()、Number()、Boolean()、Array()、Object()、Function()、RegExp()、Date()、Error()、Symbol()。


一:内部属性[[Class]]

相信大家都知道如下所示的这种使用new操作符来调用原生函数的方式:

var str1 = new String('abc');

这种方式在日常开发中很少会显式用到,但是隐式调用却很多,如下所示这种情况就是很典型的一种隐式调用:

var str2 = 'abc';
str2.split('');

就是当我们将一个基本类型的值要当做对象去用的时候,JS引擎会自动调用对应类型的內建函数将这个基本类型的值转为对象,这是一个隐性操作。

那么str1和str2有什么区别呢?我们用typeof试一试:

typeof str1;    // 'object'
typeof str2; // 'string'

通过这一点,我们就知道,调用new String()返回了一个String类型的对象。但是为什么typeof str1这个操作为什么没有返回'String'。是的,typeof并不能告诉你这个对象时什么类型,这就需要用到内部属性[[Class]]了。

所有typeof返回值为"object"的对象都包含一个内部属性[[Class]]。但是这个属性我们没办法直接访问,但可以间接访问:

Object.prototype.toString.call(str1);   // "[object String]"
Object.prototype.toString.call(str2); // "[object String]"

这样就很明了了,打印结果的"String"就是这个内部属性[[Class]]的值了。那么为什么str2也是一样的结果呢?是的,隐式转换了。


二:封装对象

这里所说的封装对象,其实就是使用new操作符调用原生函数生成的对象。在第一部分中说到隐式转换也提到了这部分的内容。

之所以需要封装对象,也很好理解。第一部分也有提到,基本类型时不具备方法的,方法都绑定在封装对象上。当然我们在开发中感受不到这个差异,是因为JS引擎在我们将一个存储着基本类型值得变量当做封装对象使用时自动生成了一个封装对象来调用对应方法,然后在调用完毕后就立即将这个对象销毁了。JS引擎针对这个过程做了优化,所以我们并不需要手动进行相关转换来提升性能。

谈到封装对象,就会涉及到封装对象的拆封问题,JS给我们提供了一个valueOf()方法,来获得封装对象的基本类型值:

var a = new String('abc');
a.valueOf(); // 'abc'

三:什么时候使用原生构造函数

在大多数情况下,都不推荐使用原生构造函数,除了Date()和Error()。其他原生函数都有相应的字面量形式可以简洁高效的声明。但是Date和Error没有。

《You dont know JS》原生函数的更多相关文章

  1. js原生函数一些封装

    这是一些js原生封装的函数,主要是为了兼容IE浏览器,如下 获取css样式 function getStyle(ele, prop) { if(window.getComputedStyle) { r ...

  2. js原生函数bind

    /*在javascript中,函数总是在一个特殊的上下文执行(称为执行上下文),如果你将一个对象的函数赋值给另外一个变量的话,这个函数的执行上下文就变为这个变量的上下文了.下面的一个例子能很好的说明这 ...

  3. 兼容主流浏览器的js原生函数封装

    1.获取和修改垂直滚动条的滚动距离 //获取滚动条滚动距离function getScrollTop(){ var fromTop=document.documentElement.scrollTop ...

  4. js原生函数

    arguments:代表所有的形参的集合: 可以通过arguments: cosole.log(arguments):打印所有参数 console.log(arguments[i]);可以通过访问下标 ...

  5. JS原生Date类型方法的一些冷知识

    ps:由于Date()是js原生函数,不同浏览器的解析器对其实现方式并不同,所以返回值也会有所区别.本文测试未特别申明浏览器的情况下,均是指win7 x64+chrome 44.0.2403.155 ...

  6. js原生的url操作函数,及使用方法。(附:下边还有jquery对url里的中文解码函数)

    js原生的url操作函数,完善的. /*****************************/ /* 动态修改url */ /*****************************/ var ...

  7. 类型和原生函数及类型转换(二:终结js类型判断)

    typeof instanceof isArray() Object.prototype.toString.call() DOM对象与DOM集合对象的类型判断 一.typeof typeof是一个一元 ...

  8. js原生之函数

    1.函数作为参数传给其他函数:    data.sort(function(a,b){return a-b})    //关于数组的sort函数,其回调函数返回负值,a在b之前    //正值,b在a ...

  9. JS的原生函数

    常用的原生函数有: String() Number() Boolean() Array() Object() Function() RegExp() Date() Error() Symbol() 1 ...

随机推荐

  1. react生命周期获取异步数据

    当react组件需要获取异步数据的时候,建议在ComponentDidMount周期里执行获取动作, 如果非异步数据,可以在ComponentWillMount获取 因为ComponentWillMo ...

  2. elixir 表单 map

    键-值对 iex(13)> map = %{:a => 1, 2 => :b}%{2 => :b, :a => 1}iex(14)> map[:a]1iex(15) ...

  3. MyBatis -01- 初识 MyBatis + MyBatis 环境搭建

    MyBatis -01- 初识 MyBatis + MyBatis 环境搭建 MyBatis 本是 apache 的一个开源项目 iBatis(iBATIS = "internet" ...

  4. Mac下驱动BCM20702A0 USB蓝牙

    偶然高了一个USB蓝牙,查到Mac下能识别,无法驱动,就去找了一下.方法很简单,就是把蓝牙的PID和VID加入到驱动里边去,具体方法和步骤如下: 1. 进入到/System/Libary/Extens ...

  5. 团队项目个人进展——Day02

    一.昨天工作总结 冲刺第二天,昨天成功接入高德地图接口,并通过官方提供的文档实现了地图定位功能,通过官方在GitHub上提供的Demo可以看出还能实现天气查看,路径规划等功能: 二.遇到的问题 虽然通 ...

  6. 聊聊 getClientRects 和 getBoundingClientRect 方法

    开始表演 今天来聊一下两个相似的方法,它们就是:getBoundingClientRect().getClientRects(). 只见它们俩手拉手地登上了舞台,一个鞠躬,便开始滔滔不绝起来. 自述 ...

  7. ASP.NET中母版页引用外部js或css文件无效,提示对象未定义解决方法

    最近做网站用了一个js+css实现的带有二级菜单的导航条,在母版页创建好后,子页面调用出现了许多奇怪的问题,多方查证后的最终解决方案和大家分享下.... 1.路径问题 如果是一个单独的aspx页面调用 ...

  8. 附加到SQL2012的数据库就不能再附加到低于SQL2012的数据库版本

    附加到SQL2012的数据库就不能再附加到低于SQL2012的数据库版本 昨天我只是将数据库附加到SQL2012,然后各个数据库都做了收缩事务日志的操作 兼容级别这些都没有改 再附加回SQL2005的 ...

  9. numpy深入理解剖析

    http://www.scipy-lectures.org/advanced/advanced_numpy/index.html

  10. Ubuntu-18.04 下修改root用户密码,安装SSH服务,允许root用户远程登录,安装vsftp服务器

    修改root用户密码 打开终端,输入 sudo passwd root 指令: 安装SSH服务 ssh默认端口号是22,可以在/etc/ssh/sshd_config文件中修改 查看服务器否开启:ne ...