【温故而知新】JavaScript数据类型

一、前言

JavaScript的数据类型有以下几种：

1. 原始类型：
   • 字符串（String）：用于表示文本数据，使用引号（单引号或双引号）括起来。
   • 数字（Number）：用于表示数值，包括整数和浮点数。
   • 布尔值（Boolean）：用于表示真或假。
   • null：表示一个空值。
   • undefined：表示一个未定义的值。
   • Symbol：表示一个独一无二的值（ES6新加入的数据类型）。
2. 引用类型：
   • 对象（Object）：用于表示复杂的数据结构，可以包含多个键值对。
   • 数组（Array）：是对象的一种特殊形式，用于存储多个值。
   • 函数（Function）：是对象的一种特殊形式，可以被调用执行。

除了以上常见的数据类型，JavaScript还有一些特殊的数据类型，如：

• Date：表示日期和时间。
• RegExp：表示正则表达式。
• Map、Set、WeakMap和WeakSet（ES6新加入的数据类型）：用于存储特定类型的数据。

二、案例代码

1. String:

let name = "John";
let message = "Hello, " + name + "!";

console.log(message); // Output: Hello, John!

2. Number:

let age = 25;
let price = 19.99;

console.log(age); // Output: 25
console.log(price); // Output: 19.99

3. Boolean:

let isTrue = true;
let isFalse = false;

console.log(isTrue); // Output: true
console.log(isFalse); // Output: false

4. Null and Undefined:

let nullValue = null;
let undefinedValue;

console.log(nullValue); // Output: null
console.log(undefinedValue); // Output: undefined

5. Symbol:

let id1 = Symbol();
let id2 = Symbol("id");

console.log(id1); // Output: Symbol()
console.log(id2); // Output: Symbol(id)

6. Object:

let person = {
  name: "John",
  age: 25,
  gender: "male"
};

console.log(person.name); // Output: John
console.log(person.age); // Output: 25
console.log(person.gender); // Output: male

7. Array:

let fruits = ["apple", "banana", "orange"];

console.log(fruits[0]); // Output: apple
console.log(fruits[1]); // Output: banana
console.log(fruits[2]); // Output: orange

8. Function:

function sayHello(name) {
  console.log("Hello, " + name + "!");
}

sayHello("John"); // Output: Hello, John!

三、存储区别

JavaScript数据类型存储区别如下：

1. 原始类型（Primitive Types）：包括字符串（String）、数字（Number）、布尔值（Boolean）、null和undefined。原始类型的值直接存储在变量中，每个变量都有自己的存储空间，它们是按值访问的。

let name = "John"; // String
let age = 25; // Number
let isTrue = true; // Boolean
let nullValue = null; // Null
let undefinedValue; // Undefined

2. 引用类型（Reference Types）：包括对象（Object）、数组（Array）、函数（Function）等。引用类型的值存储在堆内存中，变量中存储的是对该值的引用（地址），多个变量可以引用同一个对象，它们是按引用访问的。

let person = { name: "John", age: 25 }; // Object
let fruits = ["apple", "banana", "orange"]; // Array

// 函数也是引用类型
function sayHello(name) {
  console.log("Hello, " + name + "!");
}

原始类型的值在赋值给新变量时，会创建一个新的副本。而引用类型的值在赋值给新变量时，只是复制了引用地址，实际上操作的是同一个值。

let a = 10;
let b = a; // a的值复制给b
b = 20; // 修改b的值，不影响a的值

console.log(a); // Output: 10
console.log(b); // Output: 20

let obj1 = { name: "John" };
let obj2 = obj1; // obj1的引用复制给obj2
obj2.name = "Alice"; // 修改obj2的属性值，会影响obj1

console.log(obj1.name); // Output: Alice
console.log(obj2.name); // Output: Alice

需要注意的是，原始类型的赋值是按值传递，而引用类型的赋值是按引用传递。这意味着修改引用类型的属性会影响到其他引用该对象的变量，而修改原始类型的值只会影响到当前变量。

四、后记

JavaScript是一种广泛应用于网页开发的脚本语言，它可以用来为网页添加交互性和动态特效。JavaScript可以在网页中直接嵌入，也可以作为外部文件引用。

以下是JavaScript的一些重要特点和用法：

1. 脚本语言：JavaScript是一种解释型脚本语言，不需要编译，可以直接在浏览器中执行。
2. 弱类型语言：JavaScript是一种弱类型语言，变量的数据类型可以随时改变，不需要声明变量的类型。
3. 事件驱动：JavaScript可以通过监听用户的操作或者其他事件触发特定的代码执行，实现网页的交互性。
4. DOM操作：JavaScript可以通过文档对象模型（DOM）来操作网页的HTML元素，可以动态地添加、修改和删除元素。
5. 表单验证：JavaScript可以通过表单验证来确保用户输入的数据符合要求，提供更好的用户体验。
6. AJAX：JavaScript可以通过AJAX技术实现网页的异步加载，可以在不刷新整个页面的情况下更新部分内容。
7. JSON：JavaScript Object Notation（JSON）是一种轻量级的数据交换格式，JavaScript可以很方便地解析和生成JSON数据。
8. 库和框架：JavaScript拥有丰富的库和框架，如jQuery、React、Angular等，可以简化开发过程并提供更强大的功能。

JavaScript是一种强大且灵活的语言，可以用来创建复杂的交互式网页，并且可以与HTML和CSS无缝配合，实现出色的用户体验。

五、热门文章

RESTful API，如何构建 web 应用程序
jQuery实现轮播图代码
vue实现文本上下循环滚动
Vue运用之input本地上传文件，实现传参file:(binary)
js判断各种浏览器
uni-app详解、开发步骤、案例代码