【原生函数】JavaScript中的内建函数你真的懂吗？

蜡笔小心_
96 阅读2分钟

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第28天，点击查看活动详情

前言

大家在项目开发中可能经常会用到例如String、Number这样的内置函数，但是你真的会用嘛？

var str = new String('稀土掘金');
console.log(str);
  • 当我们去输出 str 时，并不是直接输出的字符串，而是一个对象，里面将我们定义的字符串给拆分成了不同的对象属性值。

image.png

你可能不知道里面的原理，那本篇内容将会带你去理解JavaScript中的内建函数，也叫原生函数。

常用的

😏 JavaScript中常用的原生函数有：

  • String()
  • Number()
  • Boolean()
  • Array()
  • Object()
  • Function()
  • RegExp()
  • Date()
  • Error()
  • Symbol() ---------- // 此项是ES6新加入的

这些原生函数都可以当做构造函数去使用，但是构造出来的对象可能会和我们想象中的有所不同。

😐 例如在 前言 中的例子，如果我们typeof或者其他方式去输出它的类型值，你会发现其中的差异。

var str = new String('稀土掘金');

typeof str;

image.png

  • typeof 返回的是对象类型的子类型，也就是前言例子中直接输出的对象类型。

new String('123') 创建出来的是字符串 123 的封装对象，并不是基本类型值 123

[[class]]内部属性

😬 所有 typeof 返回值为 Object 的对象都包含一个内部属性[[class]]

😪 这个属性是不能直接去访问的，需要通过Object.protptype.toString()来查看

Object.prototype.toString.call([1, 2, 3, 4]);

image.png

  • 数组的内部[[class]]属性值就是 Array

那么其他基本数据类型的情况会是怎样的呢？

Object.prototype.toString.call('123');

Object.prototype.toString.call(123);

Object.prototype.toString.call(true);

image.png

  • 基本数据类型都会被各自封装的对象所包裹，那么他们的内部[[class]]属性值分别为：String、Number、Boolean

🤒 基本数据类型里面还有 null 和 undefined

Object.prototype.toString.call(null);

Object.prototype.toString.call(undefined);

image.png

  • 在原生函数中，是没有 Null() 和 Undefined() ，但是内部[[class]]属性值依然是Null、Undefined。

总结

本篇文章是针对内建函数做一个基础理论知识的说明，常用的内建函数的用法大家可以在实际项目开发过程中慢慢理解，原来都是基于上面讲解的内容。

在实际项目开发中，很多原生函数会作为构建函数去使用，例如Date、Array等，如果有兴趣的话，可以在之后的文章中具体讲解这一块的内容。

avatar
文章
阅读
粉丝