JavaScript 库

JavaScript 库（Library）是别人预先写好、打包好的一批可复用函数，让我们不必从零实现常用功能。比如操作 DOM、发送请求、处理日期，调用库提供的方法即可完成。学会"站在库的肩膀上"开发，是初学者进阶的重要一步。

什么是 JavaScript 库

简单说，库就是"拿来即用的工具箱"：用 <script> 引入后，它会在全局（如 window）挂出一个对象或函数，调用它即可：

// 假设已引入某个工具库，直接使用它提供的方法
var ids = lib.uniq([1, 2, 2, 3]);
console.log(ids); // 输出：[1, 2, 3]

为什么使用库

• 省时间：动画、请求、格式化等成熟功能不必重复造轮子。
• 更可靠：经过大量项目检验，兼容性与边界情况处理得更好。
• 更好维护：代码更短、意图清晰，团队协作成本更低。
• 也要注意：库越大页面越重，引入前应先评估是否必要。

如何引入库

两种常见方式：下载到本地，或直接引用 CDN 链接。CDN 免下载、有缓存，示例中最为常用：

<!-- 方式一：本地文件 -->
<script src="js/jquery.min.js"></script>
<!-- 方式二：CDN（推荐用于练习） -->
<script src="https://example.com/jquery.min.js"></script>
<script>
    console.log(typeof jQuery); // 输出：function（引入成功，API 可用）
</script>

常见 JavaScript 库一览

库	定位	典型用途
jQuery	DOM 操作库	选择元素、事件、动画、AJAX
Lodash	工具函数库	数组 / 对象 / 字符串处理
Axios	HTTP 请求库	发送 AJAX 请求
React / Vue / Angular	前端框架	组件化、数据驱动的页面
D3.js	可视化库	数据图表绘制

引入后的使用示例

以 jQuery 为例，引入后一行代码即可隐藏一个元素（需在浏览器中运行完整 HTML）：

<script src="https://example.com/jquery.min.js"></script>
<button onclick="$('p').hide()">点击隐藏段落</button>
<p>这段文字会被隐藏</p>

小结：库 = 预封装好的工具函数集合，通过 <script> 引入后即可调用。按需选择、控制体积，是使用库的基本原则。下一节我们实际"测试"一下 jQuery 是否加载、能否正常工作。