Javascript数据类型

JavaScript中有两大数据类型，分别是基本数据类型和复杂数据类型（引用类型），其中基本数据类型有五种，分别是Number、String、Boolean、Undefined、Null；复杂数据类型（引用类型）有：Function、Array、Object、RegExp、Date、Map、Set、Symbol等等。

一. 基本数据类型的检测

在Javascript中可以使用typeof运算符可以检测值或者变量的类型

typeof 5; // number
typeof 'WEB前端课程' ; // string
var a = 12;
var b = 'WEB前端课程';
console. (log typeof a); // number
console. (log typeof b); // string

以下是各种基本数据类型的检测结果对照表：

二. 五种基本数据类型

1. Number（数字）类型

• 所有数字不分大小、不分整浮、不分正负，都是数字类型

  typeof 10000; //number
  typeof 3.13; //number
  typeof -1000 ; //number
  

• 介于0和1之间的小数，可以不书写0

  typeof .5; //number
  

• NaN(not a number),不是一个数字，但它是一个数字类型的值

  typeof NaN; //number
  

• 0除以0的结果是NaN，在数学运算中，若结果不能得到数字，其结果往往都是NaN
• NaN特性，不自等

2. String（字符串）类型

• 字符串定义：字符串要用引号包裹，双引号或者单引号均可

  typeof "WEB前端课程" ; // string
  typeof 'WEB前端课程' ; // string
  

• 字符串拼接

  // 通过+拼接
  var name = 'Boss'
  var text1 = name + '，你好！'
  console.log(text1)
  // 通过反引号拼接
  vat text2 = `${name}，你好！`
  console.log(text2)
  

• 字符串长度：通过length属性可以获取字符传的长度

  var text1 = '我喜欢你'
  var text2 = 'I LOVE YOU'
  var text3 = ''
  console.log(text1)
  console.log(text2)
  console.log(text3)
  

• 字符串常用方法
  • indexOf：某个指定的字符串值在字符串中首次出现的位置，如果没有则返回-1

    var text = '我喜欢你,喜欢你'
    console.log(text.indexOf('喜'))
    console.log(text.indexOf('a'))
    

  • charAt：得到指定位置的字符

    var text = '我喜欢JS，我也喜欢HTML'
    console.log(text.length)
    console.log(text.charAt(0))
    console.log(text.charAt(11))
    console.log(text.charAt(15))
    

  • toUpperCase：将单词全部转为大写
  • toLowerCase：将单词全部转为小写
  • subString(a, b)：从a开始到b结束（不包括b处）的子串

    var text = '我喜欢JS，我也喜欢HTML'
    console.log(text.substring(3, 5))
    // 在第二个参数省略的情况下，会返回从a开始到字符串结尾的子串
    console.log(text.substring(6))
    // 当a大于b时，方法将自动调正为从b开始到a结束（不包含a处）的子串，简单说就是实际运行时a,b互换位置
    console.log(text.substring(5, 3))
    

  • subStr(a, b)：从a开始的长度为b的子串

    var text = '我喜欢JS，我也喜欢HTML'
    console.log(text.substr(3, 2))
    // 在第二个参数省略的情况下，会返回从a开始到字符串结尾的子串
    console.log(text.substr(6))
    // 可以是负数，表示倒数位置
    console.log(text.substr(-4, 4))
    

  • slice(a, b)：从a开始到b结束（不包括b处）的子串

    var text = '我喜欢JS，我也喜欢HTML'
    console.log(text.slice(3, 5))
    // a和b均可为负数，表示倒数
    console.log(text.slice(-4, -1))
    // 参数a必须小于参数b
    console.log(text.substr(5, 2))
    

3. Boolean（布尔）类型

• 布尔（Boole·George）英国 世纪数学家及逻19辑学家。
• 布尔型值只有两个：true和false，分别表示真和假

  console.log(typeof true)
  console.log(typeof false)
  

4. Undefined类型

• 一个没有被赋值的变量的默认值是undefined，而undefined的类型也是undefined，undefined又是值，又是一种类型

  console.log(typeof undefined)
  

5. null类型

• null表示“空”，它是“空对象”
• 使用typeof检测null值，结果是object

三. 基本数据类型相互转换

1. 转数字类型

• 字符串转数字：纯数字字符串能变为数字，非纯数字的字符串将变成NaN

  console.log(Number('100')); // 123
  console.log(Number('100.99')); // 123.4
  console.log(Number('HELLO')); // NaN
  console.log(Number('2e3')); // 2000
  console.log(Number('')); // 0
  

• 布尔值转数字

  console.log(Number(true)); // 1
  console.log(Number(false)); // 0
  

• undefined和null转数字

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

• parseInt()：将字符串转为整数

  // parseInt会自动截掉第一个非数字字符之后所有字符
  parseInt('3.14');
  parseInt('3.14是圆周率');
  // 字符串不是以数字开通则转为NaN
  parseInt('圆周率是3.14');
  // parseInt不会四色五入
  parseInt('3.99');
  

• parseFloat()：将字符串转为浮点数

  // parseFloat可以将小数字符串转换成数字小数
  parseInt('3.14');
  // parseFloat会自动截掉第一个非数字字符或者非小数点之后所有字符
  parseInt('3.14是圆周率');
  // 字符串不是以数字开通则转为NaN
  parseInt('圆周率是3.14');
  // parseFloat不会四色五入
  parseInt('3.99');
  

2. 转字符串类型：可以通过String()函数或者toString()方法进行转换变为“长得相同”的字符串。

// 数字转换String，科学计数法和非10进制数字会转为10进制的值。
String(123); // '123'
String(123.4); // '123.4'
String(2e3); // '2000'
String(0xf); // '15'
String(NaN); // 'NaN'
String(Infinity); // 'Infinity'
// 布尔转换String
String(true); // 'true'
String(false); // 'false'
// undefined和null转换String
String(undefined); // 'undefined'
String(null); // 'null'

3. 转字符串类型：可以通过Boolean ()函数进行转换

// 数字转换布尔：0和NaN会转换为false
Boolean(123); // true
Boolean(0); // false
Boolean(NaN); // false
Boolean(Infinity); // true
Boolean(-Infinity); // true
// 字符串转换布尔：空字符串会转换为fasle
Boolean(''); // false
Boolean('abc'); // true
Boolean('false'); // true
// undefined和null转换布尔
Boolean(undefined); // false
Boolean(null); // false

四. 练习：计算器

1. 使用prompt()函数弹出输入框，让用户输入两个数字
2. 对用户输入两个数字进行加法运算，而由于用户输入的内容是字符串类型，所以必须先转为数字类型，才能做加法运算
3. 最后用alert()显示结果

// 让用户输入两个数字
var a = Number(prompt('请输入第一个数字'));
var b = Number(prompt('请输入第二个数字'));
// 计算两个数字的和
var sum = a + b;
// 弹出结果
alert('数字' + a + '加上数字' + b + '的结果是' + sum);