JS学习Day3之数据类型

数据类型的介绍

• 在计算机中，不同的数据所占用的存储空间是不同的，为了便于把数据分成所需内存大小不同的数据，充分利用存储空间，于是定义了不同的数据类型

• JavaScript是一种弱类型语言（动态语言）。这意味着不用提前声明变量的类型，在程序运行过程中类型会被自动确定

• JavaScript拥有动态类型，同时也意味着相同的变量可用作不同的类型

数据类型的分类

• 分为两类：
  • 简单数据类型
  • 复杂数据类型

简单数据类型

Number：

• 数字型，包含整型值和浮点型值。默认值：0

• 数字型进制：

  1. 八进制：0~7 数字前面加0表示八进制
     • 格式：var num1 = 010;（转换为十进制是8）
  2. 十六进制：0~9 a~f 数字前面加0x表示十六进制
     • 格式：var num2 = 0xA;（转换为十进制是10）

• 数字型范围：

  1. 数字型的最大值：
     • console.log(Number.MAX_VALUE);（结果为1.7976931348623157e+308）
  2. 数字型的最小值：
     • console.log(Number.MIN_VALUE);（结果为5e-324）

• 数字型的三个特殊值：

  • Infinity，代表无穷大
  • -Infinity，代表无穷小
  • NaN（Not a number），代表一个非数值

• 判断非数字：

  • 方法：isNan()
  • 结果：是数字返回false，不是数字返回true
  • 格式：console.log(isNaN(12));（返回false）

Boolean：

• 布尔值类型，包括true和false，等价于1和0。默认值：false
• 参与运算时：
  • true + 1 = 2
  • false + 1 = 1

String：

• 字符串类型，JS中字符串都带引号。默认值：""

  **注意：**可以是双引号，也可以是单引号。但是因为HTML标签里面的属性使用的是双引号，所以JS中我们推荐使用单引号

• 字符串引号嵌套：可以是单引号嵌套双引号，也可以是双引号嵌套单引号

• 字符串转义符：转义符都是\开头的

  • \加n：换行符，n是newline的意思
  • 两个\：斜杠
  • \加’：单引号
  • \加"：双引号
  • \加t：tab缩进
  • \加b：空格，b是blank的意思

• 获取字符串长度：

  • 格式：

    var str = ‘my name is andy’;

    console.log(str.length);（返回15）

• 字符串的拼接：多个字符串之间可以使用+进行拼接

  • 方法：字符串+任何类型 = 新字符串
  • 口诀：数值相加，字符相连
  • 注意：变量不能加引号，加引号的变量会变成字符串

Undefined：

• 声明了变量但没有给值，此时变量值为：undefined
• 参与运算：undefined + 1 = NaN

Null：

• 声明变量时给变量空值

获取变量数据类型

方法1

• 格式：

  var num = 10;

  console.log(typeof num);（返回number）

• 特例：

  var timer = null;

  console.log(type timer);（返回object）

• 注意：prompt取过来的值是字符型的

方法2

• 通过看控制台返回值的颜色判断
  • 蓝色：数字类型
  • 深蓝色：布尔类型
  • 黑色：字符串型
  • 浅灰色：未定义，null

方法3

• 字面量是在源代码中一个固定值的表示方法，通俗的说，字面量就是表示如何表达这个值
  • 数字字面量：8，9，10
  • 字符串字面量：“前端”，‘LXG’
  • 布尔字面量：true，false

数据类型转换

转换为字符串

// 转换为字符串
var num = 10;
// 1. 利用 .toString()
var str = num.toString();
console.log(str);
// 2. 利用 String()---强制转换
console.log(String(num))
// 3. 利用 + 拼接字符串的方法实现转换---隐式转换
console.log(num + '')

转换为数字

// 转换为数字
var age = '3.14';
// 1. 利用 parseInt()（取整函数）
console.log(parseInt(age));// 返回3，只能得到整数
console.log(parseInt('120px'));//返回120，会去掉px单位，也会去掉数字后面的字母
console.log(parseInt('rem'));//返回NaN
// 2. 利用 parseFloat()
console.log(parseFloat(age));// 返回3.14，可以得到小数
console.log(parseFloat('120px'));//返回120，会去掉px单位，也会去掉数字后面的字母
console.log(parseFloat('rem'));//返回NaN
// 3. 利用 Number()
console.log(Number(age));// 返回3.14
// 4. 利用算数运算---隐式转换
console.log(age - 0);// 返回3.14
console.log(age - '0');// 返回3.14
console.log(age * 1);// 返回3.14
console.log(age / 1);// 返回3.14

• 加法器案例：

var num1 = prompt('请你输入第一个数：');
var num2 = prompt('请你输入第二个数：');
var result = parseFloat(num1) + parseFloat(num2);
alert('您的结果是：' + result)
console.log('您的结果是：' + result);

转换为布尔型

• ’ '、0、NaN、null、undefined

  这五种会被转为false，其余值都会被转换为true

//转换为布尔型
console.log(Boolean(''));// 返回false
console.log(Boolean(0));// 返回false
console.log(Boolean(NaN));// 返回false
console.log(Boolean(null));// 返回false
console.log(Boolean(undefined));// 返回false
console.log(Boolean('LXG'));// 返回true