首页 > 编程笔记 > JavaScript笔记 阅读:3

JavaScript基本数据类型详解(附带实例)

我们知道,JavaScript 是动态类型编程语言,这意味着编程时无须指定变量的类型,JavaScript 引擎会自动识别数据的类型。

但 JavaScript 是动态类型,并不意味着 JavaScript 没有类型。在 JavaScript 当中,数据类型主要分为两大类,基本数据类型(简单数据类型)和对象数据类型(复杂数据类型):
JavaScript 提供了一个 typeof 运算符,用来检测任意变量的数据类型,示例代码如下:
console.log(typeof 666);  // number
console.log(typeof "c.biancheng.net");  // string
在上述代码中,使用 typeof 关键字检测值 666 的类型,控制台输出结果为 "number",因此值 666 的类型被称为“数字类型”或“数值类型”。

使用 typeof 关键字检测值 "c.biancheng.net" 的类型,控制台输出结果为 "string",因此值 "c.biancheng.net" 的类型被称为“字符串类型”。

使用 typeof 检测数据类型,如下表所示。需要注意的是,返回的都是数据类型名的小写字符串形式。

表 1 任意值经过 typeof 后的返回值
数据 检测后
undefined undefined
true 或 false boolean
任意字符串 string
任意数字或者 NaN number
任意对象(非函数)或者 null object
任意函数 function

下面分别演示 5 种基本数据类型的输出结果。

JavaScript number类型

任何数字都是 number 类型,无论它是整数还是小数、正数还是负数、较大数还是较小数,都属于 number 类型。

这个规定很重要,这是因为一些其他的编程语言如 Java、C++ 等,它们将数字区别为多种类型,比如整数被称为 int,而小数被称为 float、double 等。

注意,在 JavaScript 中,所有的数值都只有一种类型,即 number 类型,示例代码如下:
console.log(typeof 123);  // number
console.log(typeof 12.3);  // number
console.log(typeof 1234567890);  // number
console.log(typeof 0.000001);  // number
console.log(typeof -987654321);  // number
代码中我们用 typeof 分别测试了数字的各种情况,有整数、有小数、有较大数、有较小数以及负数,返回结果均为 "number"。

NaN 也是 JavaScript 中的一个特殊数值,一切数学运算如果难以产生普通数值结果,那么结果为 NaN。NaN 是英语“not a number”的缩写,它的英语原意为“不是一个数”。

有趣的是,虽然 NaN 表示“不是一个数”,但它本身却是一个 number 类型值,示例代码如下:
var a = "c.biancheng.net";
console.log(a);  // NaN
console.log(typeof a);  // number
运行代码后,控制台输出 NaN 和 number,这证明了 NaN 是一个 number 类型的值。

JavaScript string 类型

字符串由零个或多个字符组成。字符包括字母、数字、标点符号和空格,将字符包含在单引号或者双引号内就是字符串,示例代码如下:
console.log(typeof 'abc');  // string
console.log(typeof 'C语言中文网');  // string
console.log(typeof "C语言中文网");  // string
console.log(typeof "1234");  // string
代码中我们给变量命名为 str,它是 string 的词头,是程序员对临时字符串常见的命名习惯。使用 typeof 判断变量 str 不用加引号,运行代码后输出 "string"。

在实际开发中,建议无论是使用单引号或者是双引号都应在开发中保持一致,一些公司会限制程序员统一使用某种引号。

JavaScript boolean 类型

在 JavaScript 中,boolean 类型只有两个值:true 和 false,分别表示“真”和“假”。

“布尔类型”得名于 19 世纪英国数学家乔治·布尔,他是符号逻辑学的开创者,示例代码如下:
var a = true;
var b = false;
console.log(typeof a);  // boolean
console.log(typeof b);  // boolean
这段代码将布尔值 true 和 false 分别存入变量 a 和 b 中,然后使用 typeof 进行类型检测,输出结果都是 "boolean"。

需要注意的是,布尔值 true 和 false 是区分大小写的,因此不要书写为 True 和 False。

布尔值在实际开发中经常使用,比如“关系运算”的结果就是布尔值:
console.log(23 > 6);  // false
console.log(23 > 15);  // true
这段代码使用了大于运算符比较两组数的大小,JavaScript 中的大于运算符和数学中的大于运算符一样,都是用来比较符号两边的数字。当不等式成立时返回结果为 true,反之返回 false。

JavaScript undefined类型

前面学习变量相关知识时,我们提到一个变量如果只声明而没有赋值,则它的默认值是 undefined。

在 JavaScript 中,没有值的变量其值是 undefined,类型也是 undefined,示例代码如下:
var und;
console.log(und);  // undefined
这段代码在初始化的时候将值设置为 undefined,但在日常开发中我们一般不这么做,因为未声明的变量其默认值就是 undefined。

实际上我们可以在变量使用完成后,将变量赋值为 undefined 来清空变量数据:
var und;
und = "我是数据";
console.log(und);  // 我是数据
und = undefined;
console.log(und);  // undefined
这段代码中,第一个输出的是变量 und 的值为 "undefined",第二个输出的是变量 und 的类型为 "undefined"。代码中只是声明了变量,但是没有对它进行初始化。这个例子和下面的例子是等价的:
var und = undefined;
console.log(und);  // undefined
这段代码在初始化的时候将值设置为 undefined,但在日常开发中我们一般不这么做,因为未声明的变量其默认值就是 undefined。实际上我们可以在变量使用完成后,将变量赋值为 undefined 来清空变量数据。

JavaScript null类型

JavaScript 还有一个特殊值 null,其英语原意为“空、无效”,顾名思义,null 在 JavaScript 中表示“空”“设为无效”。

null 属于基本数据类型,该类型只有一个值为 null,示例代码如下:
var a = null;
console.log(a);  // null
console.log(typeof a);  // object
在这段代码中,第一个输出的是变量 a 的值为 null,第二个输出的是变量 a 的类型为 "object"。

大家可能会有疑问,之前的基本数据类型中案例不是返回的都是它的类型吗?为什么使用 typeof 检测 null 会返回 "object" 呢?

其实这被程序员认为是 JavaScript 的一个不能修正的小“bug”,它和 number、string、boolean、undefined 一样,属于基本类型值,但是一定要记住,使用 typeof 检测 null 的结果是 "object"。

null 这个值的用法,即一般不再需要某个对象、函数或事件监听时,就将它设置为 null 即可。常见的数学运算、关系运算、逻辑运算的计算结果不会产生 null 值。

另外,在 ES6 之前没有指定的关键字来定义存储常量(值不能改变)数据,使用 var 关键字并不能定义真正的常量,因为使用 var 关键字定义的变量都是可以被修改的。

为此 ES6 做出了改进,提供了 const 关键字来定义常量,也就是说使用 const 定义的常量是不能被修改的,一般用来保存不用改变的数据,示例代码如下:
// ES6 中 var 关键字在定义常量时可以被修改
var username1 = "c.biancheng.net";
username1 = "C语言中文网";  // 报错

// ES6 中 const 关键字定义常量时不可以被修改
const username2 = "c.biancheng.net";
username2 = "C语言中文网";  // 报错
使用 var 定义的 username1 的值被更改为“C语言中文网”,使用 const 定义的 username2 会报错,报错信息为“TypeError: Assignment to constant variable”,即不能给常量重新赋值。

如果你在实际开发中定义变量时,不确定这个变量在后期使用时是否需要修改,这种情况下建议使用 const 关键字定义。当在使用时发现需要更改该值时,可以再将声明该值的关键字改为 var。

在编程的过程中,变量和常量的命名虽然没有很高的技术含量,但对于个人编码或者在一个团队的开发中是相当重要的。良好的书写规范可以让你的 JavaScript 代码更上一个台阶,也更有利于团队的再次开发和阅读代码。

如果随意命名,在小项目中看起来可能没什么影响,但是在大型项目中,当多人协作代码维护时,弊端就会显现出来,增加了理解代码的时间,也增加了代码维护的难度,很可能会造成很难发现的 bug。因此变量的命名规范在日常开发中是至关重要的。

在制定变量的名称时,必须遵守“JavaScript 标识符命名规范”。所谓“标识符”是指变量名、函数名、类名等“名字”。

JavaScript 标识符命名规范如下:
根据 JavaScript 标识符命名规范,例如,下面的变量命名都是合法的:
var leftPostion;
var pos_2;
var number_1;
var $o0)0o$;
var _;
这五个变量的命名都是合法的。一定要记住,变量名中能够含有的“符号”只能是下画线“_”和美元符号“$”,其他的一切符号都是非法的。

变量名可以只有一个符号,比如上面最后一个例子“_”单独作为一个变量名,它没有违反标识符的命名规则是合法的。

例如,下面的变量命名都是非法的:
var 20080lympicGame;  // 命名非法,变量不能以数字开头
var b@3;  // 命名非法,变量中不能有除 _ 和 $ 外的符号
var year-2021-people;  // 命名非法,变量中不能有除 _ 和 $ 外的符号
var my#book  // 命名非法,变量中不能有除 _ 和 $ 外的符号

“JavaScript 标识符命名规范”中不允许变量的名字和关键字及保留字同名:
JavaScript 中常见关键字和保留字如下表所示。

表:JavaScript 中常见关键字和保留字
关 键 词
break case catch continue default
delete do debugger else finally
function false for if in
instanceof new null return switch
this typeof throw true try
var void with while const
class export extends import static
super throw      
保 留 字
abstract boolean byte char double
enum final float goto interface
int implements long native package
protected private public synchronized short
transient volatile      

在编程中,不仅要保证变量命名合法,而且要注意变量命名必须清晰、简明,做到“见名知意”。

试想,如果代码中的变量都用 a、b、c 等简单字母表示,那么其他程序员查看代码时,不能马上知晓这个变量的真实含义。如果变量名是“chinaGoldMedalsNumber”呢?你会立即猜到它表示的含义“中国金牌数”,这就是“见名知意”,尽管它有点长。

相关文章