实现js的方式
内联脚本
在HTML文件中直接使用<script>标签编写JavaScript代码。适用于简单脚本或快速测试。
<script>
console.log("Hello, World!");
</script>外部脚本文件
将JavaScript代码单独保存在.js文件中，通过<script>标签的src属性引入。适合代码复用和模块化开发。
<script src="script.js"></script>事件处理器
直接在HTML元素的属性中添加JavaScript代码响应事件。例如onclick、onload等。
<button onclick="alert('Clicked!')">点击</button>模块化开发
使用ES6模块系统组织代码，通过import和export语法实现文件间依赖管理。
// module.js
export function greet() {
return "Hello Module";
}
// main.js
import { greet } from './module.js';
console.log(greet());DOM操作
通过JavaScript访问和修改HTML文档对象模型(DOM)，动态更新页面内容。
document.getElementById("demo").innerHTML = "新内容";异步编程
使用回调函数、Promise或async/await处理异步操作，避免阻塞主线程。
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data));框架应用
借助React、Vue或Angular等前端框架构建复杂应用，提高开发效率。
// React示例
function App() {
return <h1>Hello React</h1>;
}Node.js后端
使用Node.js运行时在服务器端执行JavaScript，处理HTTP请求、数据库操作等。
const http = require('http');
http.createServer((req, res) => {
res.end('Hello Node');
}).listen(3000);即时执行函数
通过IIFE(Immediately Invoked Function Expression)创建独立作用域，避免污染全局命名空间。
(function() {
const privateVar = "内部变量";
})();类与面向对象
使用ES6类语法实现面向对象编程，定义构造函数和方法。
class Person {
constructor(name) {
this.name = name;
}
greet() {
console.log(`Hello ${this.name}`);
}
}
