详解JavaScript的变量和数据类型_javascript技巧-js教程-PHP中文网

首页

web前端

js教程

详解JavaScript的变量和数据类型_javascript技巧

PHP中文网

May 16, 2016 pm 03:29 PM

对于一门编程语言，肯定包含变量和数据类型。今天我们就来看看JavaScript脚本语言的变量和数据类型。相对
于其他的Java，C++等高级程序语言，JavaScript显得很简单。
一、变量
JavaScript的变量是松散类型的，所谓松散就是用来保存任何类型的数据。变量是存储信息的容器。定义变量时要使用var操作符(var是关键字)，后面跟一个变量名(变量名是标识符)。变量也就是初始化后可以再次改变的量。
那么我们来看看实例：

<span style="font-size:18px;">var x=2; 
var y=3; 
var z=2+3; 
document.write(x + "<br>"); 
document.write(y + "<br>"); 
document.write(z + "<br>");</span>

登录后复制

就像代数那样：x=2，y=3，z=x+y在代数中，我们使用字母(比如x)来保存值(比如2)。通过上面的表达式z=x+y，我们能够计算出z的值为5。在JavaScript中，这些字母被称为变量。因此我们可以把变量看做存储数据的容器。
(1)JavaScript变量名
与代数一样，JavaScript变量可用于存放值(比如x=2)和表达式(比如z=x+y)。变量可以使用短名称(比如x和y)，也可以使用描述性更好的名称(比如age,sum, totalvolume)。
需要注意的是：

1变量必须以字母开头
2变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
3变量名称对大小写敏感（y和Y是不同的变量）
(2)JavaScript数据类型
JavaScript变量还能保存其他数据类型，比如文本值(name="Bill Gates")。在JavaScript中，类似"Bill Gates"这样
一条文本被称为字符串。JavaScript变量有很多种类型，但是现在，我们只关注数字和字符串。向变量分配文本值
时，应该用双引号或单引号包围这个值。向变量赋的值是数值时，不要使用引号。如果您用引号包围数值，该值会被
作为文本来处理。在后面有详细的数据类型介绍。
实例：

<span style="font-size:18px;">var pi=3.14; 
var name="Bill Gates"; 
var answer=&#39;Yes I am!&#39;; 
document.write(pi + "<br>"); 
document.write(name + "<br>"); 
document.write(answer + "<br>");</span>

登录后复制

(3)声明(创建)JavaScript变量
在JavaScript中创建变量通常称为“声明”变量。一个好的编程习惯是，在代码开始处，统一对需要的变量进行声
明。声明变量时也可以不使用var，但是不推荐使用这种。
我们使用var关键词来声明变量：var carname;
变量声明之后，该变量是空的(它没有值)。如需向变量赋值，请使用等号：carname="Volvo";
不过，您也可以在声明变量时对其赋值：var carname="Volvo";
例子：我们创建了名为carname的变量，并向其赋值"Volvo"，然后把它放入id="demo"的HTML段落中。

<span style="font-size:18px;"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>JS变量和数据类型</title> 
</head> 
  
<body> 
<p>点击这里来创建变量，并显示结果。</p> 
  
<button onclick="myFunction()">点击这里</button> 
  
<p id="demo"></p> 
  
<script type="text/javascript"> 
function myFunction() 
{ 
var carname="Volvo"; 
document.getElementById("demo").innerHTML=carname; 
} 
</script> 
</body> 
</html></span>

登录后复制

点击效果：

(4)一条语句，多个变量
您可以在一条语句中声明很多变量。该语句以var开头，并使用逗号分隔变量即可：

var name="Gates", age=56, job="CEO";

登录后复制

声明也可横跨多行：

<span style="font-size:18px;">var name="Gates", 
age=56, 
job="CEO";</span>

登录后复制

在计算机程序中，经常会声明无值的变量。未使用值来声明的变量，其值实际上是 undefined。在执行过以下语句
后，变量carname的值将是undefined：var carname;
(5)重新声明JavaScript变量
如果重新声明JavaScript变量，该变量的值不会丢失：在以下两条语句执行后，变量carname的值依然是"Volvo"：

<span style="font-size:18px;">var carname="Volvo"; 
var carname;</span>

登录后复制

(6)JavaScript算数
您可以通过JavaScript变量来做算数，使用的是和+这类运算符：
例子：

<span style="font-size:18px;"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>JS变量和数据类型</title> 
</head> 
  
<body> 
<p>假设 y=5，计算 x=y+2，并显示结果。</p> 
<button onclick="myFunction()">点击这里</button> 
  
<p id="demo"></p> 
  
<script type="text/javascript"> 
function myFunction() 
{ 
var y=5; 
var x=y+2; 
var demoP=document.getElementById("demo") 
demoP.innerHTML="x=" + x; 
} 
</script> 
</body> 
</html></span>

登录后复制

点击效果：

二、数据类型
JavaScript的数据类型包括字符串、数字、布尔、数组、对象、Null、Undefined。在讲数据类型之前我们先讲一个操作符typeof。
typeof操作符
typeof操作符是用来检测变量的数据类型。对于值或变量使用typeof操作符会返回如下字符串：

<span style="font-size:18px;">var box=&#39;English&#39;; 
alert(typeof box); 
alert(typeof English);</span>

登录后复制

上述两种方式都是可行的。
typeof操作符可以操作变量，也可以操作字面量。虽然可以这样使用，typeof(box),但，typeof是操作符而非内置函数。函数是对象，不是一种数据类型，所以，使用typeof来区分function和object是非常有必要的。
返回值是函数的例子：

<span style="font-size:18px;">function box(){ 
} 
alert(typeof box);//box是Function函数，值是function box(){}，类型返回的字符串是function。</span>

登录后复制

(1)JavaScript拥有动态类型
JavaScript拥有动态类型。这意味着相同的变量可用作不同的类型：
实例：

<span style="font-size:18px;">var x //x为undefined 
var x = 6; //x为数字 
var x = "Bill"; //x为字符串</span>

登录后复制

(2)JavaScript字符串String类型
字符串是存储字符的变量。字符串可以是引号中的任意文本。您可以使用单引号或双引号：;
实例:可以在字符串中使用引号，只要不匹配包围字符串的引号即可

<span style="font-size:18px;">var carname1="Bill Gates"; 
var carname2=&#39;Bill Gates&#39;; 
var answer1="Nice to meet you!"; 
var answer2="He is called &#39;Bill&#39;"; 
var answer3=&#39;He is called "Bill"&#39;; 
document.write(carname1 + "<br>") 
document.write(carname2 + "<br>") 
document.write(answer1 + "<br>") 
document.write(answer2 + "<br>") 
document.write(answer3 + "<br>")</span>

登录后复制

字符串类型还定义了转义字符：

(3)JavaScript数字
JavaScript只有一种数字类型。数字可以带小数点，也可以不带。Number类型包含两种数值：整型和浮点型。输出的格式均按照十进制数输出。最基本的数值字面量是十进制。也包括八进制数值字面量，前导必须是0，八进制序列(0到7，以8为基数)；十六进制字面量前面两位必须是0x，后面的是(0到9及A到F)；浮点类型，就是该数值中必须包含一个小数点，并且小数点后面必须至少有一位数字。
1对于那些过大或过小的数值，我们可以采用科学计数法(e表示法)，用e表示该数值的前面10的指数次幂。例如：

<span style="font-size:18px;"><span style="font-size:18px;">var box=4.12e-9;</span></span>

登录后复制

2要想确定一个数值到底是否超过了规定范围，可以使用isFinite()函数，如果没有超过，返回true，超过了返回false。
3isNaN()函数用来判断这个值到底是不是NaN。isNaN()函数在接收到一个值后，会尝试将这个值转换为数值。
isNaN()函数也适用于对象。在调用isNaN()函数过程中，首先会调用value()方法，然后确定返回值是否能够转换为数值。如果不能，则基于这个返回值再调用toString()方法，再测试返回值。
实例：

<span style="font-size:18px;">var x1=36.00; 
var x2=36; 
var y=123e5; 
var z=123e-5; 
document.write(x1 + "<br />") 
document.write(x2 + "<br />") 
document.write(y + "<br />") 
document.write(z + "<br />")</span> 
 (4)JavaScript布尔
 布尔(逻辑)只能有两个值:true或false。例如：
var x=true； 
var y=false；

登录后复制

(4)JavaScript数组
数组下标是基于零的，所以第一个项目是[0]，第二个是[1]，以此类推。下面的代码创建名为cars的数组：

<span style="font-size:18px;">var cars=new Array(); 
cars[0]="Audi"; 
cars[1]="BMW"; 
cars[2]="Volvo";</span>

登录后复制

或者：

<span style="font-size:18px;">var cars=new Array("Audi","BMW","Volvo"); </span>

登录后复制

实例

<span style="font-size:18px;">var i; 
var cars = new Array(); 
cars[0] = "Audi"; 
cars[1] = "BMW"; 
cars[2] = "Volvo"; 
for (i=0;i<cars.length;i++) 
{ 
document.write(cars[i] + "<br>"); 
}</span>

登录后复制

输出的结果很容易知道。
(5)JavaScript对象
对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：
var person={firstname:"Bill", lastname:"Gates", id:5566};
上面例子中的对象(person)有三个属性：firstname，lastname以及id。空格和折行无关紧要。声明可横跨多行：

var person={ 
firstname : "Bill", 
lastname : "Gates", 
id: 5566 
};

登录后复制

对象属性有两种寻址方式：
实例

var person={ 
firstname : "Bill", 
lastname : "Gates", 
id: 5566 
}; 
document.write(person.lastname + "
"); 
document.write(person["lastname"] + "
");

登录后复制

(6)Undefined和Null
Undefined这个值表示变量不含有值。可以通过将变量的值设置为null来清空变量。
Undefined类型

var box; 
alert(typeof box);//box是Undefined类型，值是undefined，类型返回的字符串是undefined。

登录后复制

Null类型

var box=null; 
alert(typeof box);//box是Null类型，值是null，类型返回的字符串是object。

登录后复制

(7)声明变量类型
JavaScript变量均为对象。当您声明一个变量时，就创建了一个新的对象。当声明新变量时，可以使用关键词"new"来声明其类型：

var carname=new String; 
var x= new Number; 
var y= new Boolean; 
var cars= new Array; 
var person= new Object;

登录后复制

以上就是详解JavaScript的变量和数据类型_javascript技巧的内容，更多相关内容请关注PHP中文网（www.php.cn）！

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

热AI工具

Undresser.AI Undress

人工智能驱动的应用程序，用于创建逼真的裸体照片

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

免费脱衣服图片

Clothoff.io

AI脱衣机

AI Hentai Generator

免费生成ai无尽的。

显示更多

热工具

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

中文版，非常好用

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

显示更多

热门话题

gmail邮箱登陆入口在哪里

7403

Java教程

1630

CakePHP 教程

1358

Laravel 教程

1268

PHP教程

1218

显示更多

Related knowledge

MySQL数据库中性别字段应该使用什么数据类型？ Mar 14, 2024 pm 01:21 PM

在MySQL数据库中，性别字段通常可以使用ENUM类型来存储。ENUM是一种枚举类型，它允许我们在一组预定义的值中选择一个作为字段的值。在表示性别这样一个固定且有限的选项时，ENUM是一个很好的选择。让我们来看一个具体的代码示例：假设我们有一个名为"users"的表，其中包含了用户的信息，包括性别。现在我们要为性别创建一个字段，我们可以这样设计表结构：CRE

MySQL中最适合用于性别字段的数据类型是什么？ Mar 15, 2024 am 10:24 AM

在MySQL中，最适合用于性别字段的数据类型是ENUM枚举类型。ENUM枚举类型是一种允许定义一组可能取值的数据类型，性别字段适合使用ENUM类型是因为性别通常仅有两个取值，即男和女。接下来，我将通过具体的代码示例来展示如何在MySQL中创建一个性别字段并使用ENUM枚举类型存储性别信息。以下是操作步骤：首先，在MySQL中创建一个名为users的表格，包括

什么是Java中的实例变量 Feb 19, 2024 pm 07:55 PM

Java中的实例变量是指定义在类中，而不是方法或构造函数中的变量。实例变量也称为成员变量，每个类的实例都有自己的一份实例变量副本。实例变量在创建对象的过程中被初始化，以及在对象的生命周期中保存并保持其状态。实例变量的定义通常放在类的顶部，可以用任何访问修饰符来声明，可以是public、private、protected或默认访问修饰符。这取决于我们希望这个变

如何使用Ajax从PHP方法中获取变量？ Mar 09, 2024 pm 05:36 PM

使用Ajax从PHP方法中获取变量是Web开发中常见的场景，通过Ajax可以实现页面无需刷新即可动态获取数据。在本文中，将介绍如何使用Ajax从PHP方法中获取变量，并提供具体的代码示例。首先，我们需要编写一个PHP文件来处理Ajax请求，并返回所需的变量。下面是一个简单的PHP文件getData.php的示例代码：

Python 语法的思维导图：深入理解代码结构 Feb 21, 2024 am 09:00 AM

python凭借其简单易读的语法，广泛应用于广泛的领域中。掌握Python语法的基础结构至关重要，既可以提高编程效率，又能深入理解代码的运作方式。为此，本文提供了一个全面的思维导图，详细阐述了Python语法的各个方面。变量和数据类型变量是Python中用于存储数据的容器。思维导图展示了常见的Python数据类型，包括整数、浮点数、字符串、布尔值和列表。每个数据类型都有其自身的特性和操作方法。运算符运算符用于对数据类型执行各种操作。思维导图涵盖了Python中的不同运算符类型，例如算术运算符、比

深入理解C语言中的const Feb 18, 2024 pm 12:56 PM

C中const的详解及代码示例在C语言中，const关键字用于定义常量，表示该变量的值在程序执行过程中不能被修改。const关键字可以用于修饰变量、函数参数以及函数返回值。本文将对C语言中const关键字的使用进行详细解析，并提供具体的代码示例。const修饰变量当const用于修饰变量时，表示该变量为只读变量，一旦赋值就不能再修改。例如：constint

jQuery使用实践：判断变量是否为空的几种方式 Feb 27, 2024 pm 04:12 PM

jQuery是一个广泛应用于Web开发中的JavaScript库，它提供了许多简洁方便的方法来操作网页元素和处理事件。在实际开发中，经常会遇到需要判断变量是否为空的情况。本文将介绍使用jQuery判断变量是否为空的几种常用方法，并附上具体的代码示例。方法一：使用if语句判断varstr="";if(str){co

MySQL中性别字段最佳数据类型选择是什么？ Mar 14, 2024 pm 01:24 PM

在设计数据库表时，选择合适的数据类型对于性能优化和数据存储效率非常重要。在MySQL数据库中，存储性别字段的数据类型真是没有所谓的最佳选择，因为性别字段一般只有两个取值：男或女。但是为了效率和节省空间，我们可以选择合适的数据类型来存储性别字段。在MySQL中，存储性别字段最常用的数据类型是枚举类型。枚举类型是一种能够把字段的值限定在一个有限的集合内的数据类型

See all articles

详解JavaScript的变量和数据类型_javascript技巧

热AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

AI Hentai Generator

热门文章

热工具

记事本++7.3.1

SublimeText3汉化版

禅工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

热门话题