Javascript中类型知识和valueOf和toString()方法

前言:在JAVAscript这门语言中有两个比较重要的方法 。毫不夸张的说 , 前端小伙伴天天在用他们 。熟悉JavaScript这门语言的小伙伴肯定知道Javascript中两个非常重要的概念:原型和原型链 。valueOf和toString两个方法便是定义在Object原型对象身上的两个方法 。
先来打印一下这个对象:
console.log(Object.prototype) 

Javascript中类型知识和valueOf和toString()方法

文章插图
 
这就意味着 , 在Javascript中每个对象都可以调用这两个方法 。简单介绍了这两上方法之后 , 我们再来看几个相关的概念:包装对象和类型转换
包装对象:在Javascript中有六种数据类型(在ES6又增加了Symbol类型 , 本文暂不涉及):
  • 数值:number
  • 字符串:string
  • 布尔:boolean
  • undefined
  • null
  • 对象
其中 , number、string、boolean称为原始类型的值(primitive type) , 对象称为合成类型的值 。对于对象来说我们可以通过点运算符或者方括号运算符的方式来调用属性或者方法 。对于原始类型却不能这操作 , 因为他们不对象类型 , 但在开发中我们却经常看到一些写法 , 如:
var name = 'this is name'console.log(name.length) // 12对于上面代码 , name是一个string类型的 , 用typeof可以看出:
typeof name // string这是为什么呢?答案就是因为Javascript为我们提供了几个包装对象:Number、String 、Boolean , 这三个包装对象 在一定的条件下会把原始类型的值转成对象类型的值 。
先来看一下Number:
Javascript中类型知识和valueOf和toString()方法

文章插图
 
同理 , String和Boolean也是一样的操作 , 小伙伴私下可以试一下把不同的值转成String和Boolean
var num = new Number('123')typeof num // 'object' // 可以看出num已经成为一个对象类型的数据那么可以用原始类型的值调用属性或者是方法的过程就是因为原始对象借助包装对象自动转成了对象 , 过程如下:
  1. 创建一个临时的对象
  2. 调用这个对象的属性或者方法
  3. 把这个临时的对象自动销毁
看个经典的面试题:
var str = 'name'str.hello = 'hello'console.log(str.hello + ' world') // 打印出什么??再来看一下类型转换的概念
类型转换:Javascript是一种弱类型的语言 , 一个变量的类型不是一成不变的 , 有可能上行代码是number类型 , 下一行代码就成了string类型的 。有可能就出现两个不同类型的数据进行运算了 , 如:
'100' - 99 // 1这两个字符串类型的值 , 也是可以进行数值运算的 , 运算结果是1 , 这就说明在运算的时候发生的类型转换 , 字符串转成了数值 , 然后再进行运算:100 - 99 = 1
在处理类型转换的时候 , javascript提供了两种方式:强制类型转换和自动转换
强制类型转换:
通过Number()、String()和Boolean()三个函数来完成 , 咦~~怎么和前面的包装对象差不多呢 , 哈哈 , 其实就是同一个函数 , 当这三个函数被当成构造函数使用的时候 , 即使用new关键字的时候 , 就是把原始值转成对象;当函数作为普通函数的时候就是把原始值强制转成所对应的值 。
自动类型转换:
经常遇到自动转换的两种情况 , 当然还有其它情况 , 这里不一一列举了
  • 运算符两边数据类型不一样
99 + '1' // 991
  • 非布尔值求布尔值
var str = 'abc'if (str) {console.log('true')} else {console.log('false')}// 运算结果是:'true'那么问题来了 , 自动转换的规则是什么呢~
以Number转换为例:对于原始类型转有Number比较简单 , 记住那几种情况就好了 。对于合成类型是怎么做的呢?这就用了前面说过的 valueOf 和 toString 两个方法了 。
当Number函数要把一个对象转成数值的时候: