轻松上手,快乐学习!

JS 教程

JS 首页JS 教程JS 简介JS 如何使用JS 输出JS 语句JS 语法JS 注释JS 变量JS 运算符JS 算法JS 赋值JS 数据类型JS 函数JS 对象JS 事件JS 字符串JS 字符串方法JS 数值JS 数值方法JS 数组JS 数组方法JS 数组排序JS 数组迭代JS 日期JS 日期格式JS 日期获取方法JS 日期设置方法JS 数学运算JS 随机数JS 布尔运算符JS 比较运算符JS 条件语句JS Switch 语句JS For 循环JS While 循环JS BreakJS 类型转换JS 位运算符JS 正则表达式JS 错误处理JS 作用域JS HoistingJS 严格模式JS this 关键词JS Let 关键词JS Const 关键词JS 箭头函数JS 类JS 调试JS 样式指南JS 最佳实践JS 常见错误JS 性能优化JS 保留关键词JS 版本JS ES5JS ES6JS JSONJS FormsForms APIObject 对象定义Object 对象属性Object 对象方法Object DisplayObject 对象访问器Object 对象构造器Object 对象原型Object ECMAScript 5JS 函数定义JS 函数参数JS 函数调用JS Call 函数JS Apply 函数JS 函数闭包Class 类简介Class 类继承Class StaticJS 回调JS 异步JS PromisesJS Async/AwaitDOM 简介DOM 方法DOM 文档DOM 元素DOM HTMLDOM CSSDOM 动画DOM 事件DOM 事件监听DOM 导航DOM 节点DOM 集合DOM 节点列表JS WindowJS ScreenJS LocationJS HistoryJS NavigatorJS 弹出框JS TimingJS CookiesAJAX 简介AJAX XMLHttpAJAX 请求AJAX 响应AJAX XML 文件AJAX PHPAJAX ASPAJAX 数据库AJAX 应用程序AJAX 实例JSON 简介JSON 语法JSON vs XMLJSON 数据类型JSON 解析JSON 字符串化JSON 对象JSON 数组JSON PHPJSON HTMLJSON JSONPWeb API 简介Web History APIWeb Storage APIWeb Geolocation APIjQuery 选择器jQuery HTMLjQuery CSSjQuery DOMJS 实例JS HTML DOMJS HTML 输入JS HTML 对象JS HTML 事件JS BrowserJS 编辑器JS 练习JS 测验

JS 参考手册

JS 参考手册(类别排序)JS 参考手册(字母排序)


JavaScript 数据类型


JavaScript 数据类型

JavaScript 变量能够保存多种数据类型:数值、字符串值、数组、对象等等:

var length = 16;                               // Number
var lastName = "Johnson";                      // String
var x = {firstName:"John", lastName:"Doe"};    // Object

数据类型的概念

在编程过程中,数据类型是重要的概念。

为了能够操作变量,了解数据类型是很重要的。

如果没有数据类型,计算机就无法安全地解决这道题:

var x = 16 + "Volvo";

给 "Volvo" 加上 16 有意义吗?这么做会发生错误还是会产生一个结果?

JavaScript 会这样处理上面的例子:

var x = "16" + "Volvo";

当数值和字符串相加时,JavaScript 将把数值视作字符串。

实例

var x = 16 + "Volvo";
亲自试一试 »

实例

var x = "Volvo" + 16;
亲自试一试 »

JavaScript 从左向右计算表达式。不同的次序会产生不同的结果:

JavaScript:

var x = 16 + 4 + "Volvo";

结果:

20Volvo
亲自试一试 »

JavaScript:

var x = "Volvo" + 16 + 4;

结果:

Volvo164
亲自试一试 »

在第一个例子中,JavaScript 把 16 和 4 视作数值,直到遇见 "Volvo"。

在第二个例子中,由于第一个操作数是字符串,因此所有操作数都被视为字符串。


JavaScript 拥有动态类型

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

实例

var x;           // 现在 x 是 undefined
x = 5;           // 现在 x 是数值
x = "John";      // 现在 x 是字符串值
Try it yourself »

JavaScript 字符串值

字符串(或文本字符串)是一串字符(比如 "John Doe")。

字符串被引号包围。您可使用单引号或双引号:

实例

var carName1 = "Volvo XC60";   // 使用双引号
var carName2 = 'Volvo XC60';   // 使用单引号
Try it yourself »

您可以在字符串内使用引号,只要这些引号与包围字符串的引号不匹配:

实例

var answer1 = "It's alright";             // 双引号内的单引号
var answer2 = "He is called 'Johnny'";    // 双引号内的单引号
var answer3 = 'He is called "Johnny"';    // 单引号内的双引号
Try it yourself »

您将在本教程中学到更多有关字符串的知识。


JavaScript 数值

JavaScript 只有一种数值类型。

写数值时用不用小数点均可:

实例

var x1 = 34.00;     // 用小数写
var x2 = 34;        // 不带小数的写法
Try it yourself »

超大或超小的数值可以用科学计数法来写:

实例

var y = 123e5;      // 12300000
var z = 123e-5;     // 0.00123
Try it yourself »

您将在本教程中学到更多有关数值的知识。


JavaScript 布尔值

布尔值只有两个值:truefalse

实例

var x = 5;
var y = 5;
var z = 6;
(x == y)       // 返回 true
(x == z)       // 返回 false
亲自试一试 »

布尔值经常用在条件测试中。

您将在本教程中学到更多有关条件测试的知识。


JavaScript 数组

JavaScript 数组用方括号书写。

数组的项目由逗号分隔。

下面的代码声明(创建)了名为 cars 的数组,包含三个项目(汽车品牌):

实例

var cars = ["Saab", "Volvo", "BMW"];
亲自试一试 »

数组索引基于零,这意味着第一个项目是 [0],第二个项目是 [1],以此类推。

您将在本教程中学到更多有关数组的知识。


JavaScript 对象

JavaScript 对象用花括号 {} 来书写。

对象属性是 name:value 对,由逗号分隔。

实例

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
亲自试一试 »

上例中的对象(person)有四个属性:firstName、lastName、age 以及 eyeColor。

您将在本教程中学到更多有关对象的知识。


typeof 运算符

您可使用 JavaScript 的 typeof 来确定 JavaScript 变量的类型:

typeof 运算符返回变量或表达式的类型:

实例

typeof ""             // 返回 "string"
typeof "John"         // 返回 "string"
typeof "John Doe"     // 返回 "string"
亲自试一试 »

实例

typeof 0              // 返回 "number"
typeof 314            // 返回 "number"
typeof 3.14           // 返回 "number"
typeof (3)            // 返回 "number"
typeof (3 + 4)        // 返回 "number"
亲自试一试 »

Undefined

在 JavaScript 中,没有值的变量,其值是 undefined。typeof 也返回 undefined

实例

var car;    // Value is undefined, type is undefined
亲自试一试 »

任何变量均可通过设置值为 undefined 进行清空。其类型也将是 undefined

实例

car = undefined;    // 值未定义,类型未定义
亲自试一试 »

空值

空值与 undefined 不是一回事。

空的字符串变量既有值也有类型。

实例

var car = "";    // 值为 "",类型为 "string"
亲自试一试 »

Null

在 JavaScript 中,null 是 "nothing"。它被看做不存在的事物。

不幸的是,在 JavaScript 中,null 的数据类型是对象。

您可以把 null 在 JavaScript 中是对象理解为一个 bug。它本应是 null

您可以通过设置值为 null 清空对象:

实例

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = null;    // 现在 value 为 null,但 type 仍然是一个 object
亲自试一试 »

您也可以通过设置值为 undefined 清空对象:

实例

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = undefined;   // 现在值和类型都未定义
亲自试一试 »

Undefined 与 Null 的区别

Undefinednull 的值相等,但类型不相等:

typeof undefined           // undefined
typeof null                // object

null === undefined         // false
null == undefined          // true
亲自试一试 »

原始数据

原始数据值是一种没有额外属性和方法的单一简单数据值。

typeof 运算符可返回以下原始类型之一:

  • string
  • number
  • boolean
  • undefined

实例

typeof "John"              // 返回 "string"
typeof 3.14                // 返回 "number"
typeof true                // 返回 "boolean"
typeof false               // 返回 "boolean"
typeof x                   // 返回 "undefined" (如果 x 没有值)
亲自试一试 »

复杂数据

typeof 运算符可返回以下两种类型之一:

  • function
  • object

typeof 运算符把对象、数组或 null 返回 object

typeof 运算符不会把函数返回 object

实例

typeof {name:'John', age:34} // 返回 "object"
typeof [1,2,3,4]            // 返回 "object" (not "array", see note below)
typeof null                  // 返回 "object"
typeof function myFunc(){}   // 返回 "function"
亲自试一试 »

typeof 运算符把数组返回为 "object",因为在 JavaScript 中数组即对象。


学习训练

练习题:

使用注释描述以下变量的正确数据类型:

var length = 16;            // 
var lastName = "Johnson";   // 
var x = {
  firstName: "John",
  lastName: "Doe"
};                          // 

开始练习