Number() 转换为数字， String() 转换为字符串， Boolean() 转化为布尔值。

JavaScript 数据类型

在 JavaScript 中有 5 种不同的数据类型：

• string

• number

• boolean

• object

• function

3 种对象类型：

• Object

• Date

• Array

2 个不包含任何值的数据类型：

• null

• undefined

typeof 操作符

你可以使用 typeof 操作符来查看 JavaScript 变量的数据类型。

实例

typeof "John" // 返回 string

typeof 3.14 // 返回 number

typeof NaN // 返回 number

typeof false // 返回 boolean

typeof [1,2,3,4] // 返回 object

typeof {name:'John', age:34} // 返回 object

typeof new Date() // 返回 object

typeof function () {} // 返回 function

typeof myCar // 返回 undefined (如果 myCar 没有声明)

typeof null // 返回 object

请注意：

• NaN 的数据类型是 number

• 数组(Array)的数据类型是 object

• 日期(Date)的数据类型为 object

• null 的数据类型是 object

• 未定义变量的数据类型为 undefined

如果对象是 JavaScript Array 或 JavaScript Date ，我们就无法通过 typeof 来判断他们的类型，因为都是 返回 Object。

constructor 属性

constructor 属性返回所有 JavaScript 变量的构造函数。

实例

"John".constructor // 返回函数 String() { [native code] }

(3.14).constructor // 返回函数 Number() { [native code] }

false.constructor // 返回函数 Boolean() { [native code] }

[1,2,3,4].constructor // 返回函数 Array() { [native code] }

{name:'John', age:34}.constructor // 返回函数 Object() { [native code] }

new Date().constructor // 返回函数 Date() { [native code] }

function () {}.constructor // 返回函数 Function(){ [native code] }

你可以使用 constructor 属性来查看是对象是否为数组 (包含字符串 "Array"):

实例

function isArray(myArray) {

return myArray.constructor.toString().indexOf("Array") > -1;

}

你可以使用 constructor 属性来查看是对象是否为日期 (包含字符串 "Date"):

实例

function isDate(myDate) {

return myDate.constructor.toString().indexOf("Date") > -1;

}

JavaScript 类型转换

JavaScript 变量可以转换为新变量或其他数据类型：

• 通过使用 JavaScript 函数

• 通过 JavaScript 自身自动转换

将数字转换为字符串

全局方法 String() 可以将数字转换为字符串。

该方法可用于任何类型的数字，字母，变量，表达式：

实例

String(x) // 将变量 x 转换为字符串并返回

String(123) // 将数字 123 转换为字符串并返回

String(100 + 23) // 将数字表达式转换为字符串并返回

Number 方法 toString() 也是有同样的效果。

实例

x.toString()

(123).toString()

(100 + 23).toString()

在 Number 方法 章节中，你可以找到更多数字转换为字符串的方法：

将布尔值转换为字符串

全局方法 String() 可以将布尔值转换为字符串。

String(false) // 返回 "false"

String(true) // 返回 "true"

Boolean 方法 toString() 也有相同的效果。

false.toString() // 返回 "false"

true.toString() // 返回 "true"

将日期转换为字符串

全局方法 String() 可以将日期转换为字符串。

String(Date()) // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)

Date 方法 toString() 也有相同的效果。

实例

Date().toString() // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)

在 Date 方法 章节中，你可以查看更多关于日期转换为字符串的函数：

将字符串转换为数字

全局方法 Number() 可以将字符串转换为数字。

字符串包含数字(如 "3.14") 转换为数字 (如 3.14).

空字符串转换为 0。

其他的字符串会转换为 NaN (不是个数字)。

Number("3.14") // 返回 3.14

Number(" ") // 返回 0

Number("") // 返回 0

Number("99 88") // 返回 NaN

在 Number 方法 章节中，你可以查看到更多关于字符串转为数字的方法：

一元运算符 +

Operator + 可用于将变量转换为数字：

实例

var y = "5"; // y 是一个字符串

var x = + y; // x 是一个数字

如果变量不能转换，它仍然会是一个数字，但值为 NaN (不是一个数字):

实例

var y = "John"; // y 是一个字符串

var x = + y; // x 是一个数字 (NaN)

将布尔值转换为数字

全局方法 Number() 可将布尔值转换为数字。

Number(false) // 返回 0

Number(true) // 返回 1

将日期转换为数字

全局方法 Number() 可将日期转换为数字。

d = new Date();

Number(d) // 返回 1404568027739

日期方法 getTime() 也有相同的效果。

d = new Date();

d.getTime() // 返回 1404568027739

自动转换类型

当 JavaScript 尝试操作一个 "错误" 的数据类型时，会自动转换为 "正确" 的数据类型。

以下输出结果不是你所期望的：

5 + null // 返回 5 null 转换为 0

"5" + null // 返回"5null" null 转换为 "null"

"5" + 1 // 返回 "51" 1 转换为 "1"

"5" - 1 // 返回 4 "5" 转换为 5

自动转换为字符串

当你尝试输出一个对象或一个变量时 JavaScript 会自动调用变量的 toString() 方法：

document.getElementById("demo").innerHTML = myVar;

// if myVar = {name:"Fjohn"} // toString 转换为 "[object Object]"

// if myVar = [1,2,3,4] // toString 转换为 "1,2,3,4"

// if myVar = new Date() // toString 转换为 "Fri Jul 18 2014 09:08:55 GMT+0200"

数字和布尔值也经常相互转换：

// if myVar = 123 // toString 转换为 "123"

// if myVar = true // toString 转换为 "true"

// if myVar = false // toString 转换为 "false"

如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039，我们一起飞！

要识别图片类型，然后进行转换；

function btoimg(buffer) {

var mime;

var a = new Uint8Array(buffer);

var nb = a.length;

if (nb < 4)

return null;

var b0 = a[0];

var b1 = a[1];

var b2 = a[2];

var b3 = a[3];

if (b0 == 0x89 && b1 == 0x50 && b2 == 0x4E && b3 == 0x47)

mime = 'image/png';

else if (b0 == 0xff && b1 == 0xd8)

mime = 'image/jpeg';

else if (b0 == 0x47 && b1 == 0x49 && b2 == 0x46)

mime = 'image/gif';

else

return null;

var binary = "";

for (var i = 0; i < nb; i++)

binary += String.fromCharCode(a[i]);

var base64 = window.btoa(binary);

var image = new Image();

//image.onload = onLoad;

image.id = "upload";

image.src = 'data:' + mime + ';base64,' + base64;

return image;

}

击右上方红色按钮关注“web秀”，让你真正秀起来

前言

大家都知道 JavaScript 是弱类型语言，而且 JavaScript 声明变量的时候并没有预先确定的类型，变量的类型就是其值的类型，也就是说变量当前的类型由其值所决定,夸张点说上一秒种的String，下一秒可能就是个Number类型了，这个过程可能就进行了某些操作发生了强制类型转换。虽然弱类型的这种不需要预先确定类型的特性给我们带来了便利，同时也会给我们带来困扰，为了能充分利用该特性就必须掌握类型转换的原理。

下面我们来介绍JavaScript类型在什么情况下会发生类型自动转换：

什么时候自动转换为string类型

一、在没有对象的前提下

字符串的自动转换，主要发生在字符串的加法运算时。当一个值为字符串，另一个值为非字符串，则后者转为字符串。

'2' + 1 // '21' 
'2' + true // "2true" 
'2' + false // "2false" 
'2' + undefined // "2undefined" 
'2' + null // "2null"

二、当有对象且与对象+时候

//toString的对象 
var obj2 = { 
 toString:function(){ 
 return 'a' 
 } 
} 
console.log('2'+obj2) 
//输出结果2a 
 
//常规对象 
var obj1 = { 
 a:1, 
 b:2 
} 
console.log('2'+obj1)； 
//输出结果 2[object Object] 
 
//几种特殊对象 
'2' + {} // "2[object Object]" 
'2' + [] // "2" 
'2' + function (){} // "2function (){}" 
'2' + ['koala', 1] // 2koala,1

string类型转换开发过程中可能出错的点：

var obj = { 
 width: '100' 
}; 
 
obj.width + 20 // "10020"

什么时候自动转换为Number类型

一、有加法运算符，但是无String类型的时候，都会优先转换为Number类型

true + 0 // 1 
true + true // 2 
true + false //1

二、除了加法运算符，其他运算符都会把运算自动转成数值。

'5' - '2' // 3 
'5' * '2' // 10 
true - 1 // 0 
false - 1 // -1 
'1' - 1 // 0 
'5' * [] // 0 
false / '5' // 0 
'abc' - 1 // NaN 
null + 1 // 1 
undefined + 1 // NaN 
 
//一元运算符（注意点） 
+'abc' // NaN 
-'abc' // NaN 
+true // 1 
-false // 0

注意：null转为数值时为0，而undefined转为数值时为NaN。

什么时候进行布尔转换

一、布尔比较时

二、if(obj) , while(obj)等判断时或者 三元运算符只能够包含布尔值

条件部分的每个值都相当于false，使用否定运算符后，就变成了true

if ( !undefined 
 && !null 
 && !0 
 && !NaN 
 && !'' 
) { 
 console.log('true'); 
} // true 
 
//下面两种情况也会转成布尔类型 
expression ? true : false 
!! expression

js中的数据类型判断

三种方式，分别为 typeof、instanceof 和Object.prototype.toString()

一、typeof

通过 typeof操作符来判断一个值属于哪种基本类型。

typeof 'seymoe' // 'string' 
typeof true // 'boolean' 
typeof 10 // 'number' 
typeof Symbol() // 'symbol' 
typeof null // 'object' 无法判定是否为 null 
typeof undefined // 'undefined' 
 
typeof {} // 'object' 
typeof [] // 'object' 
typeof(() => {}) // 'function'

上面代码的输出结果可以看出，

1、null 的判定有误差，得到的结果 如果使用 typeof，null得到的结果是object

2、操作符对对象类型及其子类型，例如函数（可调用对象）、数组（有序索引对象）等进行判定，则除了函数都会得到 object 的结果。

综上可以看出typeOf对于判断类型还有一些不足，在对象的子类型和null情况下。

二、instanceof

通过 instanceof 操作符也可以对对象类型进行判定，其原理就是测试构造函数的prototype 是否出现在被检测对象的原型链上。

[] instanceof Array // true 
({}) instanceof Object // true 
(()=>{}) instanceof Function // true

注意：instanceof 也不是万能的。 举个例子：

let arr = [] 
let obj = {} 
arr instanceof Array // true 
arr instanceof Object // true 
obj instanceof Object // true

在这个例子中，arr 数组相当于 new Array() 出的一个实例，所以 arr.__proto__ === Array.prototype，又因为 Array属于 Object 子类型，即Array.prototype.__proto__ === Object.prototype，因此 Object 构造函数在 arr 的原型链上。所以 instanceof 仍然无法优雅的判断一个值到底属于数组还是普通对象。

Object.prototype.toString() 可以说是判定 JavaScript 中数据类型的终极解决方法了，具体用法请看以下代码：

Object.prototype.toString.call({}) // '[object Object]' 
Object.prototype.toString.call([]) // '[object Array]' 
Object.prototype.toString.call(() => {}) // '[object Function]' 
Object.prototype.toString.call('seymoe') // '[object String]' 
Object.prototype.toString.call(1) // '[object Number]' 
Object.prototype.toString.call(true) // '[object Boolean]' 
Object.prototype.toString.call(Symbol()) // '[object Symbol]' 
Object.prototype.toString.call(null) // '[object Null]' 
Object.prototype.toString.call(undefined) // '[object Undefined]' 
 
Object.prototype.toString.call(new Date()) // '[object Date]' 
Object.prototype.toString.call(Math) // '[object Math]' 
Object.prototype.toString.call(new Set()) // '[object Set]' 
Object.prototype.toString.call(new WeakSet()) // '[object WeakSet]' 
Object.prototype.toString.call(new Map()) // '[object Map]' 
Object.prototype.toString.call(new WeakMap()) // '[object WeakMap]'

我们可以发现该方法在传入任何类型的值都能返回对应准确的对象类型。用法虽简单明了，但其中有几个点需要理解清楚：

1、该方法本质就是依托Object.prototype.toString()方法得到对象内部属性 [[Class]]

2、传入原始类型却能够判定出结果是因为对值进行了包装

3、null 和 undefined 能够输出结果是内部实现有做处理

总结

重点学习几种类型自动转换，实际开发中会经常遇到这样的bug，数值大还好发现，越小越容易忽略。

喜欢小编或者觉得小编文章对你有帮助的，可以点击一波关注哦！