zh.javascript.info

zh.javascript.info

现代JavaScript教程中文版,全面深入学习资源

现代JavaScript教程中文版是一个持续更新的免费在线学习平台,提供从基础到高级的全面JavaScript教程。该项目获得React官方文档和MDN推荐,内容涵盖广泛,并拥有活跃的读者社区支持学习交流。本教程为开发者提供深入且系统的JavaScript学习资源,定期更新以保持与最新技术同步,支持读者互动和问题解答。

JavaScript教程翻译项目开源教程前端开发编程学习Github开源项目

现代 JavaScript 教程中文版

Gitter Telegram

本教程为 React 官方文档MDN 共同推荐的前端教程,持续更新,永久免费,欢迎扫码关注微信公众号,加入读者群。群内自由交流技术,群友帮忙答疑,共同进步!

<!-- - 如果你正在使用本教程学习,并且认为对你有很大帮助,也请你考虑扫码赞助本项目,请我读一本书 📚 | 微信扫码关注官方公众号,订阅更多精彩内容 | 赞助项目(支付宝)| 赞助项目(微信)| |-|-|-| | <img src="https://user-images.githubusercontent.com/26959437/64488661-0e0d2c00-d27d-11e9-82cd-751f65346617.jpg" width="400px;" /> | <img src="https://user-images.githubusercontent.com/26959437/77983009-62264d80-7340-11ea-8af9-0690289599af.jpeg" width="200px;" /> | <img src="https://user-images.githubusercontent.com/26959437/77983315-496a6780-7341-11ea-9e44-c28a942feabe.jpeg" width="200px;" /> | -->
微信扫码关注官方订阅号,订阅更多精彩内容
<img src="https://user-images.githubusercontent.com/26959437/120764347-a3b91680-c54a-11eb-9a15-31bb2596b0db.png" width="500px;" />
<img src="https://user-images.githubusercontent.com/26959437/120764353-a61b7080-c54a-11eb-8a79-75177c342b45.png" width="500px;" />

加入读者交流群:

  • 微信群:加微信 imleviding扫二维码,验证信息填写 JS 教程
  • QQ 群:打开 QQ 搜索群号 955916282扫二维码,验证信息填写 JS 教程

教程配套每日一题:https://github.com/leviding/one-note-a-day

本项目托管了现代 JavaScript 教程中文版的内容,此内容发布在 https://zh.javascript.info

Mock 工具

<a href="https://datayi.cn/w/nRbOawVP" target="_blank"><img src="https://user-images.githubusercontent.com/26959437/189130319-846e1e33-3b47-4cbc-8fe1-0fa87db5362f.svg" width="300px;" target="_blank"/></a>

分享一个好用的开源接口 Mock 工具:https://github.com/eolinker/eoapi

除了 Mock 功能,还集合了 API 管理和测试功能,还可以通过插件广场帮助你将 API 发布到各个应用平台,比如发布到网关上完成 API 上线,或者和低代码平台结合,将 API 快速变成低代码平台中可使用的组件等。

<!-- ## 赞助商 <a href="https://coding.net/?utm_source=javascript-tutorial-zh&utm_medium=banner&utm_campaign=march2019" target="_blank"><img src="https://user-images.githubusercontent.com/26959437/56273145-c56aa000-612e-11e9-9137-a1388ef18cf2.png" width="300px;" target="_blank"/></a> -->

目录

翻译

我们希望本教程可以以更多语言呈现。如果你感兴趣,那就快来和我们一起翻译吧。

详见 翻译进度

贡献指南

我们希望与更多人一起维护本教程。

发现有错误?发现有些主题教程中没有?那就赶快提交 Pull Request 来想大家分享你的知识吧 👏

你可以在任何编辑器中编辑本项目中的文件。本教程使用增强的 "MarkDown" 格式,易于掌握。而且,如果你想在本地预览效果,我们也提供了一个可以在本地运行本教程的服务端 https://github.com/javascript-tutorial/server

详细贡献者列表请见 https://javascript.info/about#contributors

翻译流程

  • 检查 中文翻译进度 issue(Chinese Translate Progress issue)
  • 选择一篇还没有被选走(在 列表 中暂未被人勾选)的文章。
  • 该 issue 中添加以文章标题为内容的评论,如 An Introduction to JavaScript
    • 我们的 bot 会在 列表 中勾选上对应的文章,这样其他人就知道你正在翻译该文章了。
    • 不要在该评论中添加其他说明。
    • 如果你发现有些文章索然已经被勾选,但是勾选人在认领任务后 15 天内未提交译文,此时你仍可以发表以该文章标题为内容的评论(并 @leviding),如 An Introduction to JavaScript @leviding
  • Fork 此仓库并开始翻译。完成翻译后,请提交一个 PR(请在认领翻译后的 15 天内提交)。
    • PR 应以文章标题命名。Bot 会自动补充更多信息。

请给维护者时间来审核和 merge 你的翻译,或者提出对应的修改意见。

如果你想成为一个维护者,请在 给我们提新 issue

<!-- 如果维护者没能回复,或者你想成为一个维护者,请在 [主仓库给我们提新 issue](https://github.com/javascript-tutorial/en.javascript.info/issues/new)。 -->

如果你愿意的话,请让其他人知道你在翻译这个教程,并尝试邀请他们参与翻译。你可以通过微博或群聊来号召。

🎉 非常感谢!

目前中文版已上线,我们会在“关于本项目”页面写上你的名字和贡献。

注:https://javascript.info/translate 列出了完整的语言列表。

文件结构

每一个章节或任务都有它自己的文件夹。

文件夹以 N-url 命名,N 为用于排序的数字,url 是该内容在网站上的链接中带有内容标题的部分。

文件的类型是依据文件夹中的文件定义的:

  • index.md 对应一个章节,
  • article.md 对应一篇文章,
  • task.md 对应一个任务(对应的答案必须在 solution.md 文件中提供)。

每一个文件都以 # 一级标题 开始。

添加新内容非常容易。

翻译提示

请不要添加换行,段落或移除已有的行和段落。这样可以减少 merge 英文版中的新变化时出现的问题。

如果你觉得英文版可以被改善 —— 欢迎,请给 英文版教程发 PR

专有词条

  • 一些具体的专有词不应被翻译。如 “Function Declaration”。
  • 对于其他专有词,如 resolved promiseslashregexp 等等,请先找找本项目 WIKI 中的「英文-中文」术语对照表 中是否已有对应的词条。
    • 若没有对应或近似的近似,则可以寻找其他教程(如:MDN)的翻译。

补充:

  • 专有词条翻译完,在其后方以括号加英文的方式补上原词条,例如:同源政策(Same Origin Policy)或转义(transpile),等等。
    • 若一篇文章出現两次以上相同专有词条,则在第一次之后补上原词条即可。
  • 若都无法找到对应的词条翻译,请直接留下原文词条。

词条含义

在英文中很多词条有明确的含义在內,但对于一个不了解英文的人来说,会忽略该含义。

请谨记有必要时可以多加解释或增加额外的翻译,例如:

`ReadableStream` objects allows to read data chunk-by-chunk.
`ReadableStream` objects 允许一个个资料块(chunk)地读取资料。

标点符号

  • 本教程标点符号格式采用 此份指南

  • 资料链接、粗体,都须 留下空白

  • 中文无斜体形式,英文的斜体翻译至中文改为 加粗

  • 斜线号 / 较为特殊,若用于分隔两同类型词条时,请维持半形斜线且两侧不加空白,但在词汇们整体的前后要留一空白做分隔:

    • Increment/decrement can only be applied to variables.递增/递减 只能被套用在变量上。
    • If the result of increment/decrement is not used, ...如果 递增/递减 的結果没被使用,...
  • 英文一句话只能有一个逗号,但中文无此限制,可依据语气通顺程度将一些英文句点转为逗号。

  • 列举项目后的文字需加句号。<- 像这样

代码块中的文本

  • 翻译注释。
  • 翻译展示给用户的信息和用来举例的字符串。
  • 不要翻译变量(variables)、类(classes)和标识符(identifiers)。
  • 确保翻译后的代码可以正常运行。 :)

例:

// Example const text = "Hello, world"; document.querySelector('.hello').innerHTML = text;

✅ 请这样翻译(翻译注解):

// 范例 const text = 'Hello, world'; document.querySelector('.hello').innerHTML = text;

❌ 別翻译成(不要翻译类):

// 范例 const text = 'Hello, world'; // ".hello" 是一个类 // 不要翻译 document.querySelector('.你好').innerHTML = text;

外部链接

本翻译教程以维持原本外部链接为原则。

但如果这个外部链接是指向 Wikipedia 的,如 https://en.wikipedia.org/wiki/JavaScript,并且其有质量优良的目标语言的译文,请将链接指向该译文。

例如:

[JavaScript](https://en.wikipedia.org/wiki/JavaScript) is a programming language.

✅ OK (en -> zh):

[JavaScript](https://zh.wikipedia.org/wiki/JavaScript) 是一种编程语言。

对于指向 MDN 的外部链接,可以使用部分翻译的版本。

如果外部链接没有翻译的版本,请不要修改该链接。

诠释资料

一些文件,通常是练习题,顶部会有 YAML 的诠释资料(Metadata)并以 --- 分隔:

importance: 5 --- ...

请不要翻译 “importance”(和其他放置在顶端的诠释资料)。

Anchors

某些标题以 [#anchor] 结尾,如:

## 扩散运算符 [#spread-operator]

请不要翻译或者去掉 [#...] 部分,它是 URL 锚点元素的依赖。

与英文版同步更新

详见 WIKI

编辑推荐精选

扣子-AI办公

扣子-AI办公

职场AI,就用扣子

AI办公助手,复杂任务高效处理。办公效率低?扣子空间AI助手支持播客生成、PPT制作、网页开发及报告写作,覆盖科研、商业、舆情等领域的专家Agent 7x24小时响应,生活工作无缝切换,提升50%效率!

堆友

堆友

多风格AI绘画神器

堆友平台由阿里巴巴设计团队创建,作为一款AI驱动的设计工具,专为设计师提供一站式增长服务。功能覆盖海量3D素材、AI绘画、实时渲染以及专业抠图,显著提升设计品质和效率。平台不仅提供工具,还是一个促进创意交流和个人发展的空间,界面友好,适合所有级别的设计师和创意工作者。

图像生成AI工具AI反应堆AI工具箱AI绘画GOAI艺术字堆友相机AI图像热门
码上飞

码上飞

零代码AI应用开发平台

零代码AI应用开发平台,用户只需一句话简单描述需求,AI能自动生成小程序、APP或H5网页应用,无需编写代码。

Vora

Vora

免费创建高清无水印Sora视频

Vora是一个免费创建高清无水印Sora视频的AI工具

Refly.AI

Refly.AI

最适合小白的AI自动化工作流平台

无需编码,轻松生成可复用、可变现的AI自动化工作流

酷表ChatExcel

酷表ChatExcel

大模型驱动的Excel数据处理工具

基于大模型交互的表格处理系统,允许用户通过对话方式完成数据整理和可视化分析。系统采用机器学习算法解析用户指令,自动执行排序、公式计算和数据透视等操作,支持多种文件格式导入导出。数据处理响应速度保持在0.8秒以内,支持超过100万行数据的即时分析。

AI工具酷表ChatExcelAI智能客服AI营销产品使用教程
TRAE编程

TRAE编程

AI辅助编程,代码自动修复

Trae是一种自适应的集成开发环境(IDE),通过自动化和多元协作改变开发流程。利用Trae,团队能够更快速、精确地编写和部署代码,从而提高编程效率和项目交付速度。Trae具备上下文感知和代码自动完成功能,是提升开发效率的理想工具。

AI工具TraeAI IDE协作生产力转型热门
AIWritePaper论文写作

AIWritePaper论文写作

AI论文写作指导平台

AIWritePaper论文写作是一站式AI论文写作辅助工具,简化了选题、文献检索至论文撰写的整个过程。通过简单设定,平台可快速生成高质量论文大纲和全文,配合图表、参考文献等一应俱全,同时提供开题报告和答辩PPT等增值服务,保障数据安全,有效提升写作效率和论文质量。

AI辅助写作AI工具AI论文工具论文写作智能生成大纲数据安全AI助手热门
博思AIPPT

博思AIPPT

AI一键生成PPT,就用博思AIPPT!

博思AIPPT,新一代的AI生成PPT平台,支持智能生成PPT、AI美化PPT、文本&链接生成PPT、导入Word/PDF/Markdown文档生成PPT等,内置海量精美PPT模板,涵盖商务、教育、科技等不同风格,同时针对每个页面提供多种版式,一键自适应切换,完美适配各种办公场景。

AI办公办公工具AI工具博思AIPPTAI生成PPT智能排版海量精品模板AI创作热门
潮际好麦

潮际好麦

AI赋能电商视觉革命,一站式智能商拍平台

潮际好麦深耕服装行业,是国内AI试衣效果最好的软件。使用先进AIGC能力为电商卖家批量提供优质的、低成本的商拍图。合作品牌有Shein、Lazada、安踏、百丽等65个国内外头部品牌,以及国内10万+淘宝、天猫、京东等主流平台的品牌商家,为卖家节省将近85%的出图成本,提升约3倍出图效率,让品牌能够快速上架。

下拉加载更多