JavaScript-----本地存储、数组中map方法、数组中join方法

JavaScript中的本地存储

定义：本地存储是浏览器提供的在客户端持久化保存数据的机制，数据存储在用户设备上，无需与服务器交互，常用于保存用户偏好、临时数据等。

主要方案对比

特性	localStorage	sessionStorage	Cookie
生命周期	永久存储，除非手动删除	仅在当前会话（标签页/窗口）有效	可设置过期时间（默认会话结束）
存储大小	约5MB	约5MB	约4KB
访问权限	同源页面共享	仅当前会话内的同源页面共享	同源页面共享（受`domain`限制）
与服务器交互	不随请求发送	不随请求发送	每次请求自动携带

1. localStorage（持久存储）

特点：数据永久保存，关闭浏览器后重新打开仍可访问。

常用API ：

javascript 复制代码

// 存储数据（键值对，值需为字符串）
localStorage.setItem('username', 'Alice'); 

// 获取数据
const name = localStorage.getItem('username'); // "Alice"

// 删除指定数据
localStorage.removeItem('username');

// 清空所有数据
localStorage.clear();

注意：存储非字符串数据（如对象）时需序列化：

下面是处理存储复杂数据类型
JSON.stringify(user) //转为JSON字符串

javascript 复制代码

const user = { name: 'Bob', age: 20 };
localStorage.setItem('user', JSON.stringify(user)); // 转为JSON字符串
const savedUser = JSON.parse(localStorage.getItem('user')); // 解析为对象

2. sessionStorage（会话存储）

特点：数据仅在当前会话（标签页/窗口）有效，关闭标签页后自动删除。

常用API ：与localStorage完全一致，仅生命周期不同：

javascript 复制代码

sessionStorage.setItem('tempData', '临时信息'); // 存储
const temp = sessionStorage.getItem('tempData'); // 获取

特性：

生命周期为关闭浏览器窗口
在同一个窗口（页面）下数据可以共享
以键值对的形式存储使用
用法跟localStorage基本相同

**注意：**记得加引号 ' '

数组中map方法

迭代数组

使用场景：

map可以遍历数组处理数组，并且返回新的数组

map 也称为映射。映射是个术语，指两个元素的集之间元素相互"对应"的关系。

map重点在于有返回值，forEach没有返回值

数组中join方法

作用：

join() 方法用于把数组中的所有元素转换一个字符串

语法：

参数;

数组元素是通过参数里面指定的分隔的，空字符串 （''），则所有元素之间都没有任何字符。