JavaScript 入门指南

最新推荐文章于 2025-03-25 22:26:41 发布

NCU_AI

最新推荐文章于 2025-03-25 22:26:41 发布

阅读量430

点赞数 3

分类专栏：经验分享文章标签： javascript

本文链接：https://blog.youkuaiyun.com/wuzigege666/article/details/143427807

版权

经验分享专栏收录该内容

11 篇文章

订阅专栏

什么是JavaScript？

JavaScript是一种广泛使用的高级编程语言，最初是为了在网页中添加交互性而设计的。随着时间的发展，JavaScript已经超越了浏览器，成为一种多用途的语言，不仅用于前端开发，还用于后端开发（通过Node.js）、服务器管理和游戏开发等多个领域。

JavaScript的历史

JavaScript由Netscape公司的Brendan Eich在1995年发明，最初的名字是Mocha，后来改名为LiveScript，最终定名为JavaScript。尽管名字中有“Java”，但实际上JavaScript与Java语言并没有直接的关系，它们之间的相似之处仅限于一些语法结构。

基本语法

JavaScript的基本语法非常简单，适合初学者快速上手。以下是一些基础概念：

变量：用于存储数据值。JavaScript使用var、let或const关键字来声明变量。
```
let age = 30; // 使用let声明变量
const name = 'John Doe'; // 使用const声明常量
```

数据类型：JavaScript支持多种数据类型，包括数字、字符串、布尔值、数组、对象等。

let number = 10;
let string = "Hello, World!";
let boolean = true;
let array = [1, 2, 3];
let object = {name: "Alice", age: 25};

函数：函数是用来执行特定任务的一段代码。可以接受参数并返回结果。

function greet(name) {
  return "Hello, " + name;
}
console.log(greet("Alice")); // 输出: Hello, Alice

条件语句：用于根据不同的条件执行不同的代码块。

if (age >= 18) {
  console.log("成年人");
} else {
  console.log("未成年人");
}

循环：用于重复执行一段代码直到满足某个条件为止。
```
for (let i = 0; i < 5; i++) {
  console.log(i);
}
```

DOM操作

DOM（Document Object Model）是HTML文档的一个API，它将文档解析为一个由节点和对象组成的树结构，允许JavaScript代码访问和更新页面的内容、结构和样式。例如：

// 改变元素的内容
document.getElementById('myDiv').innerHTML = '新的内容';

// 添加点击事件监听器
document.getElementById('myButton').addEventListener('click', function() {
  alert('按钮被点击了！');
});

异步编程

异步编程是JavaScript的一个重要特性，主要用于处理耗时的操作，如网络请求，而不阻塞用户界面。常见的异步编程模式包括回调函数、Promises和async/await。

// 使用Promise
let promise = new Promise((resolve, reject) => {
  setTimeout(() => resolve("成功！"), 1000);
});

promise.then(result => {
  console.log(result); // 1秒后输出: 成功！
});

// 使用async/await
async function fetchData() {
  try {
    let response = await fetch('https://api.example.com/data');
    let data = await response.json();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}