H5W3
当前位置:H5W3 > JavaScript > 正文

【JS】JS数据类型及其详解

一、基本数据类型

  • 数字类型 number
  • 字符串类型 string
  • 布尔类型 boolean
  • 空指针对象 null
  • 未定义undefined
  • ES6新增的symbol

二、引用数据类型

  • 对象 object
{}普通对象
[]数组对象
Math数学函数对象
Data日期对象
类数组对象
实例对象
......
  • 函数function(函数也是对象)

三、Number数据类型详解

3.1 什么是NaN?

NaN: not a number不是一个有效数字,但是它是属于数字类型的。

注意:NaN和谁都不相等,包括和自己也不相等;所以我们不能使用是否和NaN相等来判断一个数是否是非有效数字。

isNaN的检测机制: isNaN是用来检测一个数字是否为非有效数字,是非有效数字则返回true,不是非有效数字则返回false(不是非有数字就等同于是有效数字)既然使用类检测数字的,那么isNaN机制在运作的时候就首先要验证检测的值是否为数字类型,如果不是,浏览器会调用Number()这个方法将其转换为数字,然后在进行检测。

// NaN和谁都不相等,包括它自己
console.log(NaN==NaN) //=> false
console.log(NaN==10); //=> false
//=> isNaN的检测机制
console.log(isNaN(6)); //=> false
console.log(isNaN('JavaScript')); //=> true
/*
*    1. 要检测的值不是数字类型的,首先调用Number()将其转换为数字类型,然后再检测
*    Numer("JavaScript") => NaN
*    2. isNaN(NaN) =>true
*/
console.log(isNaN('6')); //=> false
/*
*    1. 要检测的值是字符串类型的,所以会调用Number()将其转换为数字类型,然后再进行检测
*    Number('6'); => 6
*    2. isNaN(6) => 6是非有效数字吗?肯定不是非有效数字了,所以结果就位false
*/

3.2 将其他类型转换为Number

将字符创转换为数字

console.log(Number('400')); //=> 400
console.log(Number('400px')); //=> NaN 遇到非有效数字字符,结果就为NaN
console.log(Number('width:400px')); //=> NaN 第一个就是非有效数字字符,所以结果直接是NaN
console.log(Number('66.6')); //=> 66.6 第一个点不会被识别为非有效数字字符
console.log(Number(Number('66.6.6'))); //=> NaN 只有第一个点不会识别非有效数字,第二个点或者连续的两个点都会被识别为非有效数字

将布尔类型转换为数字

console.log(Number(false)); //=> 0
console.log(Number(true)); //=> 1
console.log(isNaN(Number(false)));
/*
*    Number(false) => 0
*    isNaN(0); => false
*/

将null & undefined转换为数字

console.log(Number(null)); //=>0
console.log(Number(undefined)); //=>NaN

把引用数据类型转换为数字(对象和函数)

普通对象转换为字符串结果是'[object Object]';空数组转换为字符串结果是空字符串

console.log(Number({name:'小明'})); //=> NaN
/*
*    {name:'小明'}.toString() =>'[object Object]'
*    Number('[object Object]') => NaN
*/
console.log(Number([])); //=> 0 空数组转换为字符串是空字符串,空字符串转换为数字是0
console.log(Number([12,23])); //=> NaN [12,23].toString() =>'12,23' =>Number('12,23') =>NaN

四、string字符串类型

把其它类型转换为字符串

  • 其它类型转换字符串,大部分情况下都是在原来值的基础上加上双引号或者是单引号,但是对象转换为字符串一个特例,对象转换为字符串的结果是'[object Object]’
  • null 和 undefined是禁止直接调用toString()方法的,因为浏览器将其保护起来了
let str = 10;
console.log(str.toString()) //=> '10'
console.log(NaN.toString()); //=> 'NaN'
console.log({name:'小明'}.toString()); //=> '[object Object]'
console.log(null.toString()); //=> 报错 Uncaught TypeError: Cannot read property 'toString' of null
console.log(undefined.toString()); //=> 报错 Uncaught TypeError: Cannot read property 'toString' of undefined

字符串拼接

console.log('1'+1); //=> '11'
console.log('1'-1); //=> 0 把字符换转换为数字,然后再进行运算
console.log('5px'-5);
/*
*     '5px'转换为数字 => NaN
*     NaN - 5 => NaN
*/

一道关于字符串拼接的腾讯面试题

console.log(100 + true + 21.2 + null + undefined + "Tencent" + [] + null + 9 + false);
/*
*    100 + true => 101
*    101 + 21.2 => 122.2
*    122.2 + null => 122.2
*    122.2 + undefined => NaN
*    NaN + "Tencent" => "NaNTencent"
*    "NaNTencent" + [] => "NaNTencent"
*    "NaNTencent" + null => "NaNTencent"
*    "NaNTencent" + 9 => "NaNTencent9"
*    "NaNTencent9" + false => "NaNTencent9false"
*    */

五、boolean布尔数据类型

将其它类型值转换为布尔类型:只有0、NaN、''、null 和 undefined转换为布尔类型是false,其它的转换为布尔类型都是true;而且没有特殊情况。

本文地址:H5W3 » 【JS】JS数据类型及其详解

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址