JavaScript 数据类型

迈不过友情╰ 2021-11-19 11:20 288阅读 0赞

*  # **JavaScript 数据类型** #

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

var length = 7;                             // 数字
    var lastName = "Gates";                      // 字符串
    var cars = ["Porsche", "Volvo", "BMW"];         // 数组
    var x = {firstName:"Bill", lastName:"Gates"};    // 对象

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

var x = 911 + 7 + "Porsche";
    结果：
    918Porsche

var x = "Porsche" + 911 + 7;
    结果：
    Porsche9117

*  # **JavaScript 拥有动态类型** #

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

<!DOCTYPE html>
    <html>
    <body>
    <h2>JavaScript数据类型</h2>
    <p>JavaScript 拥有动态类型。这意味着相同变量可用于保存不同类型：</p>
    <p id="demo"></p>
    <script>
    var x;
    var x=7;
    var x="bill";
    document.getElementById("demo").innerHTML=x;
    </script>
    
    </body>
    </html>

*  # **JavaScript 数值** #

JavaScript 只有一种数值类型。  
写数值时用不用小数点均可

<!DOCTYPE html>
    <html>
    <body>
    <h2>JavaScript数值</h2>
    <p>写数值时用不用小数点均可：</p>
    <p id="demo"></p>
    <script>
    var x1=3.14;
    var x2=34.00;
    var x3=34;
    document.getElementById("demo").innerHTML=x1+"<br>"+x2+"<br>"+x3;
    </script>
    
    </body>
    </html>

![在这里插入图片描述][20190727154712264.png]

*  # **JavaScript 数组** #

JavaScript 数组用方括号书写。

数组的项目由逗号分隔。

下面的代码声明（创建）了名为 cars 的数组，包含三个项目（汽车品牌）

<!DOCTYPE html>
    <html>
    <body>
    <h2>JavaScript数值</h2>
    <p>数组索引基于零，这意味着第一个项目是 [0]，第二个项目是 [1]，以此类推。</p>
    <p id="demo"></p>
    <script>
    var cars=["11","22","33"];
    document.getElementById("demo").innerHTML=cars[0];
    </script>
    
    </body>
    </html>

![在这里插入图片描述][20190727155316261.png]

*  # **JavaScript 对象** #

JavaScript 对象用花括号来书写。  
对象属性是 name:value 对，由逗号分隔

<!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=utf-8" />
    <title>JavaScript 对象</title>
    <h2>JavaScript 对象</h2>
    <p id="demo"> </p>
    </head>
    
    <body>
    <script>  
    var person = {
    	firstName : "bill",
    	lastName  : "gates",
    	age       : "62",
    	eyeColor  : "blue"
    	};
    	document.getElementById("demo").innerHTML = person.firstName+"is"+person.age+"year old";
    
      </script>
    </body>
    </html>

![在这里插入图片描述][20190729092249102.png]

*  # **typeof 运算符** #

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

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

<!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=utf-8" />
    <title>Javascript typeof</title>
    <h2>Javascript typeof</h2>
    <p> typeof 运算符返回变量或表达式的类型：</p>
    <p id="demo"> </p>
    </head>
    
    <body>
    <script>  
    document.getElementById("demo").innerHTML =
    typeof "lalaal"+
    typeof ""+
    typeof 111;
    
      </script>
    </body>
    </html>

![在这里插入图片描述][20190729093556817.png]

*  # **Undefined** #

在 JavaScript 中，没有值的变量，其值是 undefined。typeof 也返回 undefined。  
任何变量均可通过设置值为 undefined 进行清空。其类型也将是 undefined。

<!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=utf-8" />
    <title>Javascript typeof</title>
    <h2>JavaScript 数据类型</h2>
    <p> 无值变量的值和数据类型是</p>
    <p id="demo"> </p>
    </head>
    
    <body>
    <script>  
    var car;
    document.getElementById("demo").innerHTML=
    car+"<br>"+typeof car;
      </script>
    </body>
    </html>

![在这里插入图片描述][20190729094222318.png]

*  # **空值** #

空值与 undefined 不是一回事。  
空的字符串变量既有值也有类型  
var car = “”; // 值是 “”，类型是 “string”

*  # **Null** #

在 JavaScript 中，null 是 “nothing”。它被看做不存在的事物。  
不幸的是，在 JavaScript 中，null 的数据类型是对象。  
可以把 null 在 JavaScript 中是对象理解为一个 bug。它本应是 null。  
可以通过设置值为 null 清空对象：  
实例  
var person = null; // 值是 null，但是类型仍然是对象  
您也可以通过设置值为 undefined 清空对象：  
var person = undefined; // 值是 undefined，类型是 undefined

*  # **Undefined 与 Null 的区别** #

Undefined 与 null 的值相等，但类型不相等：

<!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=utf-8" />
    <title>Javascript typeof</title>
    
    <p id="demo"> </p>
    </head>
    
    <body>
    <script>  
    document.getElementById("demo").innerHTML =
    typeof undefined + "<br>" +
    typeof null + "<br><br>" +
    (null === undefined) + "<br>" +
    (null == undefined);
      </script>
    </body>
    </html>

![在这里插入图片描述][20190729095739717.png]

*  # **复杂数据** #

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

function  
object  
typeof 运算符把对象、数组或 null 返回 object。  
typeof 运算符不会把函数返回 object。

typeof {name:'Bill', age:62} // 返回 "object"
    typeof [1,2,3,4]             // 返回 "object" (并非 "array"，参见下面的注释)
    typeof null                  // 返回 "object"
    typeof function myFunc(){}   // 返回 "function"

[20190727154712264.png]: /images/20211119/aefcb84da94b4988a937068d0e4af754.png
[20190727155316261.png]: /images/20211119/b50ae21124df43eab97e0fa486d76bbd.png
[20190729092249102.png]: /images/20211119/cd97b1b9d1f9479081b01a1006b3783a.png
[20190729093556817.png]: /images/20211119/e0289c4641724a128862128e28bd459b.png
[20190729094222318.png]: /images/20211119/7160e67cbf014886b61482c1fdffbe29.png
[20190729095739717.png]: /images/20211119/0e19bd3151064a2babb9acf1116752af.png