JavaScript对初学者来说既是福音,也是挑战。一方面,掌握它后可以构建各种项目,比如网站、应用程序和服务器,还能在很多行业找到工作。但另一方面,它又充满怪异之处,并被各种复杂的库和框架包围。在这段课程中,我们将一起探讨这门语言的奥秘。
JavaScript由Brendan Eich于1993年在Netscape公司创建。当时,网络浏览器是一项革新性技术,将人们通过互联网连接起来。那时的网站都是静态的,主要依靠HTML来构建。JavaScript的诞生是为了让这些网页变得更加互动,且开发过程更简单。如今,它已成为全球最受欢迎的编程语言之一,现代版本称为ECMAScript。JavaScript也是唯一能在所有浏览器中原生运行的语言。
除了浏览器外,工具如Node.js和Deno还允许我们在服务器上运行JavaScript代码。作为一种脚本语言,你可以直接在浏览器的开发者工具中运行代码,实时看到效果。JavaScript的执行引擎——V8——采用即时编译,将代码转换为机器码以提高性能。
要开始使用JavaScript,你需要一个HTML页面,并在其中插入<script>
标签。你可以直接在标签内写代码,比如console.log("Hello, World!");
,它会在浏览器的开发者控制台中输出结果。
在JavaScript中,变量的声明方式有多种。常见的有let
,用于声明可变变量;const
则用于不可重新赋值的变量。而var
是旧版的变量声明方式,尽量避免使用。
理解变量的作用域对避免代码错误很重要。在函数内部声明的变量只能在该函数内使用,而全局声明的变量则可在程序的任何地方访问。另一个需要注意的是分号的使用。JavaScript允许省略分号,但许多开发者建议使用它以避免潜在错误。
JavaScript中的函数是核心组件。函数可以接收参数并返回值,还能作为对象使用,这为高级函数提供了可能。此外,函数内部还能嵌套其他函数,形成闭包,使内部函数能够访问外部函数的变量,即使外部函数已经结束执行。
// 示例1:创建一个简单的交互网页,点击按钮显示提示框
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JavaScript 交互示例</title>
</head>
<body><button id="clickMe">点击我!</button><script>document.getElementById("clickMe").addEventListener("click", function() {alert("你点击了按钮!");});</script>
</body>
</html>// 示例2:使用 async/await 进行异步请求
async function fetchData() {try {let response = await fetch('https://jsonplaceholder.typicode.com/posts/1');let data = await response.json();console.log("数据获取成功:", data);} catch (error) {console.error("获取数据出错:", error);}
}
fetchData();// 示例3:使用箭头函数和闭包实现计数器功能
function createCounter() {let count = 0;return () => {count++;console.log(`当前计数:${count}`);};
}const counter = createCounter();
counter(); // 当前计数:1
counter(); // 当前计数:2
counter(); // 当前计数:3