JavaScript 简介

什么是 JavaScript？

JavaScript 是一种轻量级、解释型且具有动态特性的高级编程语言，广泛应用于构建交互式网页和实现丰富的动态功能。

JavaScript 由 Brendan Eich 于 1995 年在 Netscape（网景）公司开发，最初命名为 LiveScript。当时正值 Java 语言快速崛起，出于营销策略的考量，Netscape 将其更名为 JavaScript——尽管这一命名容易让人产生误解。

实际上 JavaScript 与 Java 在语法特性、设计理念和应用场景上都存在本质区别。这次更名成功借助了 Java 的热度，使得这门新兴的脚本语言迅速获得业界关注，最终成为 Web 开发领域不可或缺的核心技术。

JavaScript 核心特性

作为现代 Web 开发的三大核心技术（HTML、CSS、JavaScript）之一，JavaScript 不仅在前端开发中扮演着关键角色，还可应用于服务端开发、移动应用开发、跨平台桌面应用以及游戏开发等多个领域，展现出强大的适应性和灵活性。

✅ JavaScript 之所以能在 Web 开发领域占据不可替代的地位，主要得益于以下几个核心特性：

1. 动态类型：变量类型在运行时确定（如let x = 10; x = "hello";）。

2. 单线程执行：同一时间只能执行一个任务，但通过事件循环（Event Loop）实现非阻塞 I/O，适合处理高并发场景（如 Node.js）。

3. 函数是一等公民：函数可作为参数传递、返回值或赋值给变量，支持 函数式编程（如回调函数、闭包）。

4. 异步编程：通过回调函数、Promise、async/await 处理异步操作（如网络请求、文件读写），避免阻塞主线程。

5. 基于原型的面向对象：通过原型链（prototype chain）实现继承，而非类（Class）的传统面向对象模式（ES6 引入 class 语法糖，底层仍基于原型）。

JavaScript 应用场景

✅ JavaScript 是一种应用场景极其广泛的编程语言，其主要应用领域包括以下几个方面：

在前端开发领域，JavaScript 能够实现网页内容的动态更新，比如表单验证和数据实时渲染；处理各种用户交互行为，包括按钮点击和动画效果的实现；还能通过 AJAX 或 Fetch 技术完成前后端的数据交互，实现异步数据加载等功能。

在后端开发领域，借助 Node.js 运行时环境，JavaScript 可以用于构建高性能的服务器应用，包括 Web 服务器开发、API 接口编写以及基于 WebSocket 的实时通信系统等，同时还能结合 Express、Koa 等框架快速搭建 RESTful 服务。

在移动开发领域，通过 React Native、Flutter（虽然主要使用 Dart 语言，但支持与 JavaScript 互操作）以及 Weex 等跨平台框架，开发者可以使用 JavaScript 来构建原生移动应用。

在桌面应用领域，Electron 框架让 JavaScript 能够用于开发功能强大的桌面程序，像 VS Code 和微信桌面版等知名软件都是基于这项技术构建的。

在游戏开发领域，JavaScript 也有出色表现，通过 Phaser.js、Three.js 等专业库，开发者可以创建各种 2D 或 3D 网页游戏。

此外，JavaScript 还广泛应用于各类工具和脚本的开发，包括自动化构建工具如 Webpack 和 Gulp，以及基于 Node.js 的命令行工具等，充分展现了其作为脚本语言的强大灵活性。

JavaScript 使用实例

1. JavaScript 直接写入 HTML 输出流

使用 JavaScript 的 document.write() 方法直接向 HTML 输出流写入内容，从而动态生成网页元素：

document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落。</p>");

2. JavaScript：改变 HTML 图像

使用 JavaScript 的 getElementById() 方法获取图像元素，并通过修改其 src 属性来改变图像的显示内容：

function changeImage() {
    const element = document.getElementById('myimage');
    if (element.src.includes("turn-on")) {
        element.src = "/uploads/20250812/turn-off.jpg";
    } else {
        element.src = "/uploads/20250812/turn-on.jpg";
    }
}