数据类型简介

为什么需要数据类型

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

变量的数据类型

变量是用来存储值得所在处,它们有名字和数据类型。变量的数据类型决定了如何将代表这些值的位存储到计算机的内存中。JavaScript是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型,在程序运行过程中,类型会被自动确定。

1
2
var num = 10;        // 这是一个数字型
var hello = "world"; // 这是一个字符串

在代码运行时,变量的数据类型是由JS引擎根据 = 右边变量值的数据类型来判断的,运行完毕之后,变量就确定了数据类型。

JavaScript拥有动态类型,意味着相同的变量可用作不同的类型:

1
2
var x = 6;       // x为数字
var x = "hello"; // x为字符串

数据类型的分类

JS把数据类型分为两类:

  • 简单数据类型(Number,String,Boolean,Undefined,Null)
  • 复杂数据类型(Object)

简单数据类型

简单数据类型(基本数据类型)

JavaScript中的简单数据类型及其说明如下:

简单数据类型 说明 默认值
Number 数字型,包含整型值和浮点型值,如21、0.21 0
Boolean 布尔值类型,如true、false,等价于1和0 false
String 字符串类型,如"张三" “”
Undefined var a; 声明了变量a但是没有赋值,此时a = undefined undefined
Null var a = null; 声明了变量a为空值 null

数字型Number

JavaScript数字类型既可以用来保存整数值,也可以保存小数(浮点数)。

1
2
var age = 18;    // 整数
var PI = 3.1415; // 小数

数字型进制

最常见的进制有二进制、八进制、十进制和十六进制。

1
2
3
4
5
var num2 = 0b1111; // 对应十进制15

var num8 = 017; // 对应十进制15

var num16 = 0xf; // 对应十进制15

数字型范围

JavaScript中数字型的最大值和最小值:

1
2
alert(Number.MAX_VALUE); // 1.7976931348623157e+308
alert(Number.MIN_VALUE); // 5e-324
  • 最大值:Number.MAX_VALUE,这个值为:1.7976931348623157e+308
  • 最小值:Number.MIN_VALUE,这个值为:5e-32

数字型三个特殊值

1
2
3
alert(Number.MAX_VALUE * 2);  // Infinity
alert(-Number.MAX_VALUE * 2); // -Infinity
alert('hello' - 100); // NaN
  • Infinity,代表无穷大,大于任何数值
  • -Infinity,代表无穷小,小于任何数值
  • NaN,Not a number,代表一个非数值

isNaN()

用来判断一个变量是否为非数字的类型,返回true或者false

1
2
console.log(21);      // false, 21不是一个非数字
console.log("hello"); // true, "hello"是一个非数字

字符串型String

字符串型可以是引号中的任意文本,其语法为双引号""单引号’'

1
2
3
4
var str1 = "hello";    // 使用双引号表示字符串
var str2 = 'world'; // 使用单引号表示字符串
// 常见错误
var str3 = helloworld; // 报错,没使用引号,会被认为是js代码,但js没有这些语法

因为HTML标签里面的属性使用的是双引号,JS这里更推荐使用单引号

字符串引号嵌套

JS可以用单引号嵌套双引号,或者用双引号嵌套单引号外双内单,外单内双

1
2
3
4
5
var str1 = 'hello "string"'; // 用''包含""
var str2 = "hello 'string'"; // 用""包含''
// 常见错误
var str3 = 'hello world";
// 报错,不能单双引号搭配

字符串转义符

转义符都是 \ 开头的,常见的转义符及其说明如下:

转义符 解释说明
\n 换行符,n是newline的意思
\|斜杠|
\’ ’ 单引号
\" " 双引号
\t tab缩进
\b 空格,b是blank的意思

案例 弹出网页警示框

1
alert("hello world");

字符串长度

字符串都是由若干字符组成的,这些字符的数量就是字符串的长度。通过字符串的length属性可以获取整个字符串的长度。

1
2
var str = "hello";
alert(str.length); // 显示5

字符串拼接

  • 多个字符串之间可以使用 + 进行拼接,其拼接方式为字符串 + 任何类型 = 拼接之后的新字符串
  • 拼接前会把与字符串相加的任何类型转成字符串,再拼接成一个新的字符串
1
2
3
4
5
6
// 1.字符串“相加”
alert("hello" + " " + "world"); // hello world
// 2.数值字符串“相加”
alert("100" + "100"); // 100100
// 3.数值字符串 + 数值
alert("1" + "1"); // 11

+ 号总结口诀:数值相加,字符相连

字符串拼接加强

1
2
var age = 18;
console.log("张三" + age + "岁了"); // 张三18岁了
  • 经常会将字符串和变量拼接,因为变量可以很方便的修改里面的值
  • 变量是不能添加引号的,因为加引号的变量会变成字符串
  • 如果变量两侧都有字符串拼接,口诀“引引加加”,删掉数字,变量写加(+)中间

案例 显示年龄

弹出一个输入框,需要用户输入年龄,之后弹出一个警示框显示“您今年xx岁了”(xx表示刚才输入的年龄)

交互编程的三个基本要素:

  • 用户输入
  • 程序内部处理
  • 输出结果

在程序中实现的方法:

  1. 弹出一个输入框(prompt),让用户输入年龄(用户输入
  2. 把用户输入的值用变量保存起来,把刚才输入的年龄与所需要输出的字符串拼接(程序内部处理
  3. 使用alert语句弹出警示框(输出结果
1
2
3
var age = prompt("请输入您的年龄");
var str = "您今年已经" + age + "岁了";
alert(str);

布尔型Boolean

布尔类型有两个值:true和false,其中true表示真(对),而false表示假(错)。