原生函数

原生函数,即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. 教程:RSS全文输出,自己动手做。(一)

    这里以PHP版为例,尽量说得通俗点吧,水平实在有限,见谅. 目前我这里所有的获取全文输出的网站大概是三种情况: 要输出的内容集中在一页上,也就是看似列表页的页面里集中了你想要的所有内容,并不需要点击“ ...

  2. 百度 echarts K线图使用

    看个效果图先 首先在需要插入图例的HTML中嵌入 <div id="main" style="height:400px"></div> ...

  3. 遇到的一个渲染的bug

    id=center1 的元素,如果js代码需要设置其宽高,则属性必须设置为display. 否则html会先计算该元素的高宽,子元素会根据该元素进行响应的渲染,后续js代码就算更改了center1的高 ...

  4. git 上传文件到仓库上提示:origin does not to be a git repository

    最近上传代码到GitHub的时候,当我输入 git push -u origin master的时候,它提示: origin does not to be a git repository 在网上找到 ...

  5. Windows7设置锁屏密码

    1.设置开机密码 2.设置屏幕保护程序 注意,不要选择无,选择其他的都可以,比如:气泡.彩带.空白

  6. react实例:理解dva构建项目的原理

    请点击相应的步骤查看详情 我们首先搭建一个 dva Demo  项目(请参考react快速构建一个应用项目),然后逐步完成以下内容: 结构划分 设计 Model 组件设计方法 组件设计实践 添加 Re ...

  7. Oracle EBS 查询物料报错

  8. C# 判断程序是否已经在运行

    方式1: /// <summary> /// 应用程序的主入口点. /// </summary> [STAThread] static void Main() { //获取欲启 ...

  9. .net下log4net的使用

    这里以控制台应用程序为例 首先是要添加引用: 安装后可以看到项目中多了log4net的引用: 添加应用程序配置文件app.config,配置log4net <?xml version=" ...

  10. Jquery 保留N位小数,且千位以上用","号隔开

    s:数据Value n:保留小数位数 function jinEFmoney(s, n) { if (s == '' || s == null) return '0.00'; n = n > 0 ...