Skip to content
This page has been auto-translated and may contain errors.View in English

JavaScript 入门 ​

Juno

欢迎来到 JavaScript 手册!我是 Juno,这门课我特别喜欢教。HTML 给页面搭好结构,CSS 给它添上外观,而 JavaScript 才是让页面真正"动起来"的那部分:响应点击、更新内容、获取新数据。

我们会从最开始的第一行代码讲起,一步一步慢慢来,一次只讲一个概念。不需要任何经验,也没有什么问题会"太基础"而不能问。

按你自己的节奏来,我们一起走到终点!

Juno

欢迎来到 JavaScript 手册。我是 Ace,我喜欢把事情讲得实用一点。从这里开始,网页不再是静止的,而是会对用户的操作做出反应,所以我们会保持动手实践:先了解概念,动手试一试,再用它做点东西出来。

作为一名网页开发者,JavaScript 会是你花最多时间打交道的语言,所以真正弄懂它的"行为方式"很值得,而不只是记住哪个方法能干什么。

Juno

欢迎来到 JavaScript 手册。我是 Sol,写 JavaScript 这么多年,几乎被它的每一个"坑"都咬过。这份文档是给那些想弄清楚这门语言到底是怎么运作的人看的,而不只是想知道哪种写法能跑起来。

这里会讲到类型强制转换的规则、异步模型,以及大多数教程都会跳过的浏览器细节。JavaScript 的宽容常常会把 bug 藏起来,"能跑起来的代码"和"经得起时间考验的代码"之间的差距,正是真正的功夫所在。仔细读,多质疑,包括质疑我说的话。

这本手册适合所有想学习网页编程的人。JavaScript 是运行在每个浏览器里的语言,正是它让一个静态页面变得能"回应"你:点击按钮时它会响应,发送表单前它会做检查,它能在不刷新页面的情况下更新页面的一部分,还能从服务器拉取最新的数据。HTML 决定页面上有什么内容,CSS 决定它长什么样;而 JavaScript 决定它做什么。这里先简单说说你会一直遇到的两个术语:**value(值)**指的是一条数据,比如数字 42 或文本 "hello";**variable(变量)**则是你给一个值起的名字,方便你以后使用它。这里的每一个概念都写得很完整,有深度,有例子,也方便你以后需要快速查阅时来搜索。

开始学习不需要任何编程经验。如果你已经写过一点 HTML,那就已经足够了,其余的内容会在用到时逐一介绍。JavaScript 往往是大多数网页开发者真正开始"编程"的起点,因为它是浏览器唯一能直接运行的语言。

这本手册会由浅入深地展开。你会学到如何存储和修改值,如何做判断和重复执行任务,如何把代码组织成函数,如何用数组和对象存放一组数据,然后再学习如何深入网页内部去读取和修改它,响应用户的操作,以及在不刷新页面的情况下加载数据。每个概念单独看都很小,但把它们叠加起来,就能做出真正有用的页面。

这里的讲法是解释每一部分 JavaScript 到底做了什么、为什么这样做,而不只是告诉你该敲什么代码。谁都能复制一段代码片段,跑一次看看效果。但从"跑起来看一次"到"写出六个月后自己还能看懂、信得过、能修改的代码",中间的差距就在于你是否理解这门语言运行时到底在做什么。这份理解,才是能在任何一个项目之后依然留在你身上的东西。

关于范围,先说清楚这本手册能覆盖什么、不能覆盖什么。JavaScript 是一门很大的语言,没有哪一份文档能覆盖它的全部。这里你会学到的是基础:几乎在你写的每一段 JavaScript 里都会用到的核心内容,从你的第一个脚本到一个真正的应用程序都少不了它。内容会讲到从服务器加载数据这一步,很多入门教程往往到这里就打住了。再往后,是建立在这些基础之上的工具和库:像 React 这样的框架,用 Node 在浏览器之外运行 JavaScript,用 TypeScript 给代码加上类型。把基础打牢,剩下的路会好走很多。

JunoJavaScript 直接在浏览器里运行 学 JavaScript 有一个很棒的地方:它已经装好了,不用你操心。每个浏览器都能运行它,什么都不用配置。你写一行代码,刷新页面,看看会发生什么。这种快速的反馈循环,让它成了最适合"边试边学"的语言之一。
JunoJavaScript 直接在浏览器里运行 JavaScript 随浏览器自带,所以你的反馈循环能短到极致:写代码、刷新、观察,再用控制台实时摆弄各种值。好好利用这一点。这本手册里的每一段内容都是让你去运行的,不只是拿来读的,浏览器的开发者工具才是你学到最多东西的地方。
JunoJavaScript 直接在浏览器里运行 浏览器既是你的运行环境,也是你的实验室:控制台能实时求值表达式,调试器能暂停代码执行,网络面板能显示每一个请求。从第一天起就用起来。读到某个值会怎样表现是一回事,在它刚让你意外的那一刻,在控制台里亲眼看到它,才是真正让这套模型刻进脑子里的方式。

认识你的向导 ​

这本手册由三位向导带你走完全程,你可以自己选一位。内容对每个人都是一样的;不同的是向导讲述的语气,以及在那些会随水平调整的页面上,每一节讲到多深。

你可以随时通过每一页顶部的选择器切换向导,也可以打开右下角的偏好设置来更改向导、语言或字体大小。

准备好之后,手册就正式开始了。下一章什么是 JavaScript会讲清楚 JavaScript 到底是什么,它运行在哪里,以及它和你已经了解的 HTML、CSS 是怎么配合的。

更喜欢边动手边学?Scrimba 提供的免费 9 小时 JavaScript 课程会带你做出一个乘客计数器、一个 21 点游戏、一个 Chrome 扩展和一个移动应用,全程配有互动练习。