From cea888eb3b9e224be6e910710b5d1e7dc6bbc308 Mon Sep 17 00:00:00 2001 From: sqrtthree Date: Sun, 8 Apr 2018 22:46:01 +0800 Subject: [PATCH 1/9] Transfer the existing translation, ready for review Co-authored-by: eric yang resolve #1 --- 1-js/01-getting-started/1-intro/article.md | 145 ++++++++++-------- .../2-code-editors/article.md | 78 ++++++---- 1-js/01-getting-started/3-devtools/article.md | 60 ++++---- 3 files changed, 157 insertions(+), 126 deletions(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index 10bd54fedb..fa8107fa39 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -1,121 +1,132 @@ -# An Introduction to JavaScript +# JavaScript 简介 -Let's see what's so special about JavaScript, what we can achieve with it and which other technologies play well with it. +我们一起来聊一下 JavaScript,用它能做什么,它有哪些特性,以及一些跟它配合使用的技术。 -## What is JavaScript? +## 什么是 JavaScript ? -*JavaScript* was initially created to *"make webpages alive"*. +**JavaScript** 最初的目的是为了 **“ 让网页动起来 ”**。 -The programs in this language are called *scripts*. They can be written right in the HTML and execute automatically as the page loads. +这种编程语言我们称之为**脚本**。把它嵌入到 HTML 当中,在页面加载的时候会自动执行。 -Scripts are provided and executed as a plain text. They don't need a special preparation or a compilation to run. +脚本作为纯文本存在和执行,并不需要编译执行。 -In this aspect, JavaScript is very different from another language called [Java](http://en.wikipedia.org/wiki/Java). +这方面, JavaScript 和 [Java](http://en.wikipedia.org/wiki/Java) 有很大的区别。 ```smart header="Why JavaScript?" -When JavaScript was created, it initially had another name: "LiveScript". But Java language was very popular at that time, so it was decided that positioning a new language as a "younger brother" of Java would help. +JavaScript 在创建的时候,它的名字叫 “LiveScript”。因为当时 Java 很流行,所以就取了个名字叫 JavaScript。这样就可以让大家认为, JavaScript 是 Java 的弟弟。 -But as it evolved, JavaScript became a fully independent language, with its own specification called [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript), and now it has no relation to Java at all. +随着 JavaScript 的发展,它已经变成了一门独立的语言,同时也有了自己的语言规范 [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript)。现在,Java 和 JavaScript 已经是两门不同的语言,彼此之前也没有任何关系。 ``` -At present, JavaScript can execute not only in the browser, but also on the server, or actually on any device where there exists a special program called [the JavaScript engine](https://en.wikipedia.org/wiki/JavaScript_engine). +现在,JavaScript 不仅仅是在浏览器内执行,也可以在服务端执行。甚至在存在任意 [JavaScript 引擎](https://en.wikipedia.org/wiki/JavaScript_engine)的环境中都可以执行。 -The browser has an embedded engine, sometimes it's also called a "JavaScript virtual machine". +浏览器中嵌入了 JavaScript 引擎,有时也称作 JavaScript 虚拟机。 -Different engines have different "codenames", for example: +不同的引擎有不同的名字,例如: -- [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- in Chrome and Opera. -- [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- in Firefox. -- ...There are other codenames like "Trident", "Chakra" for different versions of IE, "ChakraCore" for Microsoft Edge, "Nitro" and "SquirrelFish" for Safari etc. +* [V8]() --Chrome 和 Opera 中的 JavaScript 引擎 。 +* [Gecko]() --Firefox 中的 JavaScript 引擎。 +* ... 也有一些其他的 JavaScript 引擎,“Trident” 和 “Chakra” 是不同版本 IE 的 JavaScript 引擎,“ChakraCore” 是 Microsoft + Edge 的 JavaScript 引擎 , “Nitro” 和 “SquirrelFish” 是 Safari 的 JavaScript 引擎,等等。 -The terms above are good to remember, because they are used in developer articles on the internet. We'll use them too. For instance, if "a feature X is supported by V8", then it probably works in Chrome and Opera. +上面这些很容易记忆,因为经常出现在网上关于开发的文章中。我们也会这样用。例如:某个新的功能,JavaScript 引擎 V8 是支持的 +;那么我们可以认为这个功能在 Chrome 和 Opera 中可以正常运行。 -```smart header="How engines work?" +```smart header="How the engines work?" +引擎很复杂,但是基本原理很简单。 -Engines are complicated. But the basics are easy. +1. 脚本是纯文本(可以被压缩)。 +2. 引擎(通常嵌入在浏览器中)读取(理解)这些文本并转化(编译)成机器语言。 +3. 然后就可以在机器上飞速的运行。 -1. The engine (embedded if it's a browser) reads ("parses") the script. -2. Then it converts ("compiles") the script to the machine language. -3. And then the machine code runs, pretty fast. - -The engine applies optimizations on every stage of the process. It even watches the compiled script as it runs, analyzes the data that flows through it and applies optimizations to the machine code based on that knowledge. At the end, scripts are quite fast. +在每一个阶段,引擎都会做一些优化。引擎甚至会监视脚本的执行,分析数据流,从而采取相应的优化措施。 ``` -## What can in-browser JavaScript do? +## 浏览器中的 JavaScript 能干什么 ? + +现在的 JavaScript 是一种安全语言。它不会去操作计算机的内存和 CPU。因为 JavaScript 最开始就是为浏览器准备的,浏览器也不需 +要操作这些。 -The modern JavaScript is a "safe" programming language. It does not provide low-level access to memory or CPU, because it was initially created for browsers which do not require it. +JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wikipedia.org/wiki/Node.js) 就可以读写文件,可以发送响应网 +络请求。 -The capabilities greatly depend on the environment that runs JavaScript. For instance, [Node.JS](https://wikipedia.org/wiki/Node.js) supports functions that allow JavaScript to read/write arbitrary files, perform network requests etc. +浏览器中的 JavaScript 只处理和网页相关的操作,处理网页和用户的交互以及网页和服务端的网络请求。 -In-browser JavaScript can do everything related to webpage manipulation, interaction with the user and the webserver. +浏览器中的 JavaScript,可以干下面这些事: -For instance, in-browser JavaScript is able to: +* 在网页中插入新的 HTML,修改现有的网页内容和网页的样式。 +* 响应用户的行为,响应鼠标的点击或移动,键盘的敲击。 +* 向远程服务器发送请求,下载或上传文件([AJAX]() 和 + [COMET]()技术)。 +* 获取或修改 cookie,向用访问者发送消息,提问题。 +* 存储浏览器端的一些本地数据(本地存储)。 -- Add new HTML to the page, change the existing content, modify styles. -- React to user actions, run on mouse clicks, pointer movements, key presses. -- Send requests over the network to remote servers, download and upload files (so-called [AJAX](https://en.wikipedia.org/wiki/Ajax_(programming)) and [COMET](https://en.wikipedia.org/wiki/Comet_(programming)) technologies). -- Get and set cookies, ask questions to the visitor, show messages. -- Remember the data on the client-side ("local storage"). +## 浏览器中的 JavaScript **不**能干什么? -## What CAN'T in-browser JavaScript do? +为了用户的(信息)安全,在浏览器中的 JavaScript 的能力是有限的。这样主要是为了阻止邪恶的网站获得或修改用户的私人数据。 -JavaScript's abilities in the browser are limited for the sake of the user's safety. The aim is to prevent an evil webpage from accessing private information or harming the user's data. +例如: -The examples of such restrictions are: +* 网页中的 JavaScript 不能读、写、复制及执行用户磁盘上的文件或程序。也不能直接控制操作系统。 -- JavaScript on a webpage may not read/write arbitrary files on the hard disk, copy them or execute programs. It has no direct access to OS system functions. + 现代浏览器允许 JavaScript 做一些文件相关的操作,但是这个操作是受到限制的。仅当用户使用某个特定的动作,JavaScript 才能 + 操作这个文件。例如,把文件 “ 拖 ” 到浏览器中,或者通过 `` 标签选择文件。 - Modern browsers allow it to work with files, but the access is limited and only provided if the user does certain actions, like "dropping" a file into a browser window or selecting it via an `` tag. + JavaScript 有很多方式和设备的照相机 / 麦克风交互,这些都需要提前获得用户的允许。所以,JavaScript 并不会偷偷的通过你的 + 摄像头观察你,更不会把你的信息发送到 [NSA](https://en.wikipedia.org/wiki/National_Security_Agency)。 - There are ways to interact with camera/microphone and other devices, but they require a user's explicit permission. So a JavaScript-enabled page may not sneakily enable a web-camera, observe the surroundings and send the information to the [NSA](https://en.wikipedia.org/wiki/National_Security_Agency). -- Different tabs/windows generally do not know about each other. Sometimes they do, for example when one window uses JavaScript to open the other one. But even in this case, JavaScript from one page may not access the other if they come from different sites (from a different domain, protocol or port). +- 不同的浏览器标签页基本彼此不相关。有时候,也会有一些关系。例如,通过 JavaScript 打开另外一个新的标签页。如果两个标签页 + 打开的不是同一个网站,他们不能够相互通信(域名、协议或者端口任一不相同的网站,都认为是不同的网站)。 - This is called the "Same Origin Policy". To work around that, *both pages* must contain a special JavaScript code that handles data exchange. + 这就是 “ 同源策略 ”。为了解决不同标签页交互的问题,两个同源的网站必须**都**包含特殊的 JavaScript 代码,才能够实现数据 + 交换。 - The limitation is again for user's safety. A page from `http://anysite.com` which a user has opened must not be able to access another browser tab with the URL `http://gmail.com` and steal information from there. -- JavaScript can easily communicate over the net to the server where the current page came from. But its ability to receive data from other sites/domains is crippled. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's safety limitations. + 这个限制也是为了用户的信息安全。例如,来自 `http://anysite.com` 的网页的 JavaScript 不能够获取任何 + `http://gmail.com`(另外一个标签页打开的网页)页面的数据。 + +- JavaScript 通过互联网可以很容易的和服务器通讯(当前网页域名的服务器)通讯。但是从其他的服务器中获取数据的功能是受限的 + ,需要(在 HTTP 头中)添加某些参数。这也是为了用户的数据安全。 ![](limitations.png) -Such limits do not exist if JavaScript is used outside of the browser, for example on a server. Modern browsers also allow installing plugin/extensions which may get extended permissions. +非浏览器中的 JavaScript ,一般没有这些限制。例如服务端的 JavaScript 就没有这些限制。现代浏览器还允许通过 JavaScript 来安装浏览器插件或扩展,当然这也是在用户授权的前提下。 -## What makes JavaScript unique? +## JavaScript 为什么与众不同? -There are at least *three* great things about JavaScript: +至少有 **3** 件事值得一提: ```compare -+ Full integration with HTML/CSS. -+ Simple things done simply. -+ Supported by all major browsers and enabled by default. ++ 和 HTML/CSS 完全的集成。 ++ 使用简单的工具(语言)完成简单的任务。 ++ 被所有的主流浏览器支持,并且默认开启。 ``` -Combined, these three things exist only in JavaScript and no other browser technology. - -That's what makes JavaScript unique. That's why it's the most widespread tool to create browser interfaces. +满足这三条的浏览器技术也只有 JavaScript 了。 -While planning to learn a new technology, it's beneficial to check its perspectives. So let's move on to the modern trends that include new languages and browser abilities. +这就是为什么 JavaScript 与众不同!这也是为什么大家都通过 JavaScript 来跟浏览器交互。 +当然,学习一项新技术的时候,最好先看一下他的前景。所以,接下来,我们来看看新的趋势(包含一些新的语言)。 -## Languages "over" JavaScript +## 比 JavaScript “ 好 ” 的语言 -The syntax of JavaScript does not suit everyone's needs. Different people want different features. +不同的人喜欢不同的功能,JavaScript 的语法也不能够满足所有人。 -That's to be expected, because projects and requirements are different for everyone. +这是正常的,因为每个人的项目和需求都不一样。 -So recently a plethora of new languages appeared, which are *transpiled* (converted) to JavaScript before they run in the browser. +所以,最近出现了很多不同的语言,这些语言在浏览器中执行之前,都会被**编译**(转化)成 JavaScript。 -Modern tools make the transpilation very fast and transparent, actually allowing developers to code in another language and autoconverting it "under the hood". +现代的工具编译得很快,并且让用户不可感知。这就允许开发中使用一种新的语言,就和使用 JavaScript 一样。 -Examples of such languages: +例如: -- [CoffeeScript](http://coffeescript.org/) is a "syntactic sugar" for JavaScript, it introduces shorter syntax, allowing to write more precise and clear code. Usually Ruby devs like it. -- [TypeScript](http://www.typescriptlang.org/) is concentrated on adding "strict data typing", to simplify development and support of complex systems. It is developed by Microsoft. -- [Dart](https://www.dartlang.org/) is a standalone language that has its own engine that runs in non-browser environments (like mobile apps). It was initially offered by Google as a replacement for JavaScript, but as of now, browsers require it to be transpiled to JavaScript just like the ones above. +* [CoffeeScript](http://coffeescript.org/) 是 JavaScript 的语法糖,他语法简短,精确简捷。通常使用 Ruby 的人喜欢用。 +* [TypeScript](http://www.typescriptlang.org/) 主要是是添加了严格类型系统。这样就能简化开发,也能用于开发复杂的系统。TypeScript 是微软开发的。 +* [Dart](https://www.dartlang.org/) 是一门独立的语言。他拥有自己的引擎,在非浏览器环境中运行(如:在手机应用中运行)。最开始是 Google 提供的用于替代 JavaScript 的,但是现在,浏览器也需要它和上面的语言一样需要被编译成 JavaScript 。 -There are more. Of course even if we use one of those languages, we should also know JavaScript, to really understand what we're doing. +当然,还有更多其他的语言。即使我们在使用这些语言,我们也需要知道 JavaScript。因为学习 JavaScript 可以让我们真正明白我们自己在做什么。 -## Summary +## 总结 -- JavaScript was initially created as a browser-only language, but now it is used in many other environments as well. -- At this moment, JavaScript has a unique position as the most widely-adopted browser language with full integration with HTML/CSS. -- There are many languages that get "transpiled" to JavaScript and provide certain features. It is recommended to take a look at them, at least briefly, after mastering JavaScript. +* JavaScript 最开始是为浏览器设计的一门语言,但是现在也可以在其它的环境中运行。 +* 现在,JavaScript 是一门在浏览中使用最广、并且能够很好集成 HTML/CSS 的语言。 +* 有很多其他的语言可以编译成 JavaScript,这些语言还提供更多的功能。最好要了解一下这些语言,至少在掌握 JavaScript 之后,需要简单的看一下。 diff --git a/1-js/01-getting-started/2-code-editors/article.md b/1-js/01-getting-started/2-code-editors/article.md index 0d714cdb27..d3f4e77c89 100644 --- a/1-js/01-getting-started/2-code-editors/article.md +++ b/1-js/01-getting-started/2-code-editors/article.md @@ -1,56 +1,72 @@ -# Code editors +# 编辑器 -A code editor is the place where programmers spend most of their time. +程序员接触时间最长的就是代码编辑器 (后面简称编辑器)。 -There are two archetypes: IDE and lightweight editors. Many people feel comfortable choosing one tool of each type. +编辑器主要分两种:IDE(集成开发环境) 和轻量编辑器。很多人喜欢这两种各选一个。 + +[cut] ## IDE -The term [IDE](https://en.wikipedia.org/wiki/Integrated_development_environment) (Integrated Development Environment) means a powerful editor with many features that usually operates on a "whole project". As the name suggests, that's not just an editor, but a full-scale "development environment". +[IDE](https://en.wikipedia.org/wiki/Integrated_development_environment) (集成开发环境) 是用于管理整个项目具有强大功能 +的编辑器。也就是说,不仅仅是编辑器,而且还是开发环境。 + +IDE 加载项目(通常包含多个文件),并且允许在不同文件之间切换。IDE 还提供基于项目的自动补全功能,集成版本控制,集成测试环 +境等一些其他用于开发的东西。 + +如果你还没考虑好选哪一款 IDE,看看下面: -An IDE loads the project (can be many files), allows navigation between files, provides autocompletion based on the whole project (not just the open file), integrates with a version management system (like [git](https://git-scm.com/)), a testing environment and other "project-level" stuff. +* IntelliJ editors: [WebStorm](http://www.jetbrains.com/webstorm/) 供前端开发使用。 除了前端,如果你们还需要使用其他语言 + ,那么可以考虑 [PHPStorm (PHP)](http://www.jetbrains.com/phpstorm/), + [IDEA (Java)](http://www.jetbrains.com/idea/),[RubyMine (Ruby)](http://www.jetbrains.com/ruby/) 。 -If you haven't considered selecting an IDE yet, look at the following variants: +* Visual Studio 一般 .NET 开发者喜欢用。 +* 基于 Eclipse 的产品,例如 : [Aptana](http://www.aptana.com/) 和 Zend Studio。 +* [Komodo IDE](http://www.activestate.com/komodo-ide) 以及他的轻量版 + [Komodo Edit](http://www.activestate.com/komodo-edit)。 +* [Netbeans](http://netbeans.org/)。 -- [WebStorm](http://www.jetbrains.com/webstorm/) for frontend development and other editors of the same company if you need additional languages. -- Visual Studio is fine if you're a .NET developer, and a free version is available ([Visual Studio Community](https://www.visualstudio.com/vs/community/)) -- [Netbeans](http://netbeans.org/). +除了 Visual Studio,以上这些 IDE 都是跨平台的。Visual Studio 现在有 Mac 版本和 Windows 版本的。 -All of the IDEs except Visual Studio are available on Windows, MacOs and Linux. Visual Studio doesn't work on Linux. +大多数 IDE 是收费的,但是他们都可以试用。这些费用对于一个合格的程序员来说,肯定算不了什么,所有还是选一个最好的。 -Most IDEs are paid, but have a trial period. Their cost is usually negligible compared to a qualified developer's salary, so just choose the best one for you. +## 轻量编辑器 -## Lightweight editors +“ 轻量编辑器 ” 没有 IDE 那么功能强大,但是他们一般很快,简单,而且优雅。 -"Lightweight editors" are not as powerful as IDEs, but they're fast, elegant and simple. +“ 轻量编辑器 ” 主要用于立即打开编辑一个文件。 -They are mainly used to instantly open and edit a file. +“ 轻量编辑器 ” 和 IDE 有很大的区别。IDE 一般是项目中使用,就意味着一开始要加载很多数据,并且在使用的过程中会分析项目的结 +构和内容。如果我们只需要编辑一个文件,那么 “ 轻量编辑器 ” 会更快的帮我们打开文件。 -The main difference between a "lightweight editor" and an "IDE" is that an IDE works on a project-level, so it loads much more data on start, analyzes the project structure if needed and so on. A lightweight editor is much faster if we need only one file. +实际上,“ 轻量编辑器 ” 一般都有各种各样的插件,这些插件可以做语法分析,可以补全代码。所以 “ 轻量编辑器 ” 和 IDE 也没有严 +格的界限。 -In practice, lightweight editors may have a lot of plugins including directory-level syntax analyzers and autocompleters, so there's no strict border between a lightweight editor and an IDE. +下面是一些流行的 “ 轻量编辑器 ”: -The following options deserve your attention: +* [Visual Studio Code](https://code.visualstudio.com/)(跨平台,免费)。 +* [Atom](https://atom.io/)(跨平台,免费)。 +* [Sublime Text](http://www.sublimetext.com)(跨平台,共享软件)。 +* [Notepad++](https://notepad-plus-plus.org/)(Windows, 免费)。 +* Vim, Emacs 很棒 , 如果你们知道怎么用得话。 -- [Visual Studio Code](https://code.visualstudio.com/) (cross-platform, free). -- [Atom](https://atom.io/) (cross-platform, free). -- [Sublime Text](http://www.sublimetext.com) (cross-platform, shareware). -- [Notepad++](https://notepad-plus-plus.org/) (Windows, free). -- [Vim](http://www.vim.org/) and [Emacs](https://www.gnu.org/software/emacs/) are also cool, if you know how to use them. +## 我喜欢的 -## My favorites +项目开发我一般用 IDE,编辑个别文件我会用 “ 轻量编辑器 ”。 -The personal preference of the author is to have both an IDE for projects and a lightweight editor for quick and easy file editing. +我使用的编辑器: -I'm using: +* IDE-- [WebStorm](http://www.jetbrains.com/webstorm/) 写 JS, 如果项目涉及其他语言我会选择 + [PHPStorm](http://www.jetbrains.com/phpstorm/) (PHP), [IDEA](http://www.jetbrains.com/idea/) (Java), + [RubyMine](http://www.jetbrains.com/ruby/)(Ruby)。 对于其他的语言还有一些其他的编辑器,不过我只用过上面的这几款。 +* 轻量编辑器 -- [Sublime Text](http://www.sublimetext.com)或[Atom](https://atom.io/)。 -- [WebStorm](http://www.jetbrains.com/webstorm/) for JS, and if there is one more language in the project, then I switch to one of the other Jetbrains offerings listed above. -- As a lightweight editor -- [Sublime Text](http://www.sublimetext.com) or [Atom](https://atom.io/). +如果你们不知道怎么选,可以考虑考虑这些。 -## Let's not argue +## 不要争吵 -The editors in the lists above are those that either I or my friends who I consider good developers have been using for a long time and are happy with. +上面列举的这些编辑器,一般是我或者我的朋友在使用的。 -There are other great editors in our big world. Please choose the one you like the most. +世上还有很多其他的很好的编辑器,你们可以选择一个你们最喜欢的。 -The choice of an editor, like any other tool, is individual and depends on your projects, habits, personal preferences. +选择编辑器就像选择其他工具一样。要看个人的习惯,个人的喜好,以及开发的项目。 diff --git a/1-js/01-getting-started/3-devtools/article.md b/1-js/01-getting-started/3-devtools/article.md index f250502df0..c37ceb7e50 100644 --- a/1-js/01-getting-started/3-devtools/article.md +++ b/1-js/01-getting-started/3-devtools/article.md @@ -1,58 +1,62 @@ -# Developer console +# 开发者控制台 -Code is prone to errors. You are quite likely to make errors... Oh, what am I talking about? You are *absolutely* going to make errors, at least if you're a human, not a [robot](https://en.wikipedia.org/wiki/Bender_(Futurama)). +代码有错误。你的代码好像有错误 ...... 哦,我在说什么?只要你是人,你一定会犯错误(在写代码的时候),除非你是[机器人]()。 -But in the browser, a user doesn't see the errors by default. So, if something goes wrong in the script, we won't see what's broken and can't fix it. +但在浏览器中,用户默认是看不到错误的。所以,如果脚本中有错误,我们看不到是什么错误,更不能够修复。 -To see errors and get a lot of other useful information about scripts, browsers have embedded "developer tools". +为了发现错误和获得一些与脚本相关且有用的信息,浏览器嵌入了 “ 开发者工具 ”。 -Most often developers lean towards Chrome or Firefox for development, because those browsers have the best developer tools. Other browsers also provide developer tools, sometimes with special features, but are usually playing "catch-up" to Chrome or Firefox. So most people have a "favorite" browser and switch to others if a problem is browser-specific. +通常,开发者倾向于使用 Chrome 或 Firefox 来开发,是因为他们有最好的开发者工具。一些其他的浏览器也提供开发者工具,有时还 +具有一些特殊的功能,通常他们都是在追赶 Chrome 或 Firefox。所以大多数人都有 “ 最喜欢 ” 的浏览器,当遇到某个浏览器独有的问 +题的时候,人们就会切换到其他的浏览器。 -Developer tools are really powerful, there are many features. To start, we'll learn how to open them, look at errors and run JavaScript commands. +开发者工具很强大,功能丰富。刚开始,我们要学习如何打开他们,查找错误,执行 JavaScript 命令。 + +[cut] ## Google Chrome -Open the page [bug.html](bug.html). +打开网页 [bug.html](bug.html)。 -There's an error in the JavaScript code on it. It's hidden from a regular visitor's eyes, so let's open developer tools to see it. +有个错误在 JavaScript 代码中。一般的访问者看不到这个错误,所以,让我们打开开发者工具看看。 -Press `key:F12` or, if you're on Mac, then `key:Cmd+Opt+J`. +按下 `key:F12` 键, 如果你使用 Mac, 试试 `key:Cmd+Opt+J`。 -The developer tools will open on the Console tab by default. +开发者工具会被打开,Console 标签页是默认的标签页。 -It looks somewhat like this: +就像这样: ![chrome](chrome.png) -The exact look of developer tools depends on your version of Chrome. It changes from time to time, but should be similar. - -- Here we can see the red-colored error message. In this case the script contains an unknown "lalala" command. -- On the right, there is a clickable link to the source `bug.html:12` with the line number where the error has occurred. - -Below the error message there is a blue `>` symbol. It marks a "command line" where we can type JavaScript commands and press `key:Enter` to run them (`key:Shift+Enter` to input multi-line commands). +具体什么样,要看你的 Chrome 版本。它随着时间一直在变,但是都很类似。 -Now we can see errors and that's enough for the start. We'll be back to developer tools later and cover debugging more in-depth in the chapter . +* 这个上面,我们能看到红色的错误信息。这个场景中,脚本里有一个未知的 “lalala” 命令。 +* 在右边,有个可点击的链接 `bug.html:12`。这个链接会链接到错误发生的行号。 +在错误信息的下方,有个 `>` 标志。它代表 “ 命令行 ”,在 “ 命令行 ” 中,我们可以输入 JavaScript 命令,按下 `key:Enter` 来 +执行 ( `key:Shift+Enter` 用来输入多行命令 )。 -## Firefox, Edge and others +现在,我们能看到错误就够了。稍后,在 章节中,我们会重新更加深入的讨论开发者工具。 -Most other browsers use `key:F12` to open developer tools. +## Firefox, Edge 和其他 -The look & feel of them is quite similar. Once you know how to use one of them (you can start with Chrome), you can easily switch to another. +大多数其他的浏览器都是通过 `key:F12` 来打开开发者工具。他们的外观和感觉都非常相似,一旦你学会了他们中的一个(可以先尝试 +Chrome),其他的也就很快了。 ## Safari -Safari (Mac browser, not supported by Windows/Linux) is a little bit special here. We need to enable the "Develop menu" first. +Safari ( Mac 系统中浏览器 , 不支持 Windows 和 Linux 系统 ) 有一点点不同。我们需要先开启 “ 开发菜单 ”。 -Open Preferences and go to "Advanced" pane. There's a checkbox at the bottom: +打开 “ 偏好设置 ...”, 点 “ 高级 ”。选中最下方的那个选择框。 ![safari](safari.png) -Now `key:Cmd+Opt+C` can toggle the console. Also note that the new top menu item named "Develop" has appeared. It has many commands and options. +现在,我们通过 `key:Cmd+Opt+C` 就能打开或关闭控制台了。另外注意,名字为 “ 开发 ” 的顶部菜单出现了。有很多命令和选项。 -## Summary +## 总结 -- Developer tools allow us to see errors, run commands, examine variables and much more. -- They can be opened with `key:F12` for most browsers under Windows. Chrome for Mac needs `key:Cmd+Opt+J`, Safari: `key:Cmd+Opt+C` (need to enable first). +* 开发者工具允许我们查看错误,执行命令 ( 脚本 ),检查变量等等。 +* 在 Windows 系统中,可以通过 `key:F12` 开启开发者工具。Mac 系统下,Chrome 需要使用 `key:Cmd+Opt+J`,Safari 使用 + `key:Cmd+Opt+C` ( 需要提前开启 )。 -Now we have the environment ready. In the next section we'll get down to JavaScript. +现在我们的环境准备好了,下一章,我看开始 JavaScript。 From 4419c11df872b8a6ba88956c42c4242a109ae2c4 Mon Sep 17 00:00:00 2001 From: sqrtthree Date: Thu, 12 Apr 2018 12:16:43 +0800 Subject: [PATCH 2/9] Translate index.md --- 1-js/01-getting-started/index.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/1-js/01-getting-started/index.md b/1-js/01-getting-started/index.md index b327c78603..76f3379b3c 100644 --- a/1-js/01-getting-started/index.md +++ b/1-js/01-getting-started/index.md @@ -1,3 +1,3 @@ -# An introduction +# 一个简介 -About the JavaScript language and the environment to develop with it. +介绍 JavaScript 语言及其开发环境。 From 54b94e07984a82dfae3bf84c2abf8469fc80cdaf Mon Sep 17 00:00:00 2001 From: sqrtthree Date: Thu, 12 Apr 2018 14:27:55 +0800 Subject: [PATCH 3/9] fix(intro): Fix some typos --- 1-js/01-getting-started/1-intro/article.md | 92 ++++++++++------------ 1 file changed, 40 insertions(+), 52 deletions(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index fa8107fa39..289969d98e 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -4,18 +4,18 @@ ## 什么是 JavaScript ? -**JavaScript** 最初的目的是为了 **“ 让网页动起来 ”**。 +**JavaScript** 最初的目的是为了 **“让网页动起来”**。 -这种编程语言我们称之为**脚本**。把它嵌入到 HTML 当中,在页面加载的时候会自动执行。 +这种编程语言我们称之为**脚本**。把它们正确编写到 HTML 当中,在页面加载的时候会自动执行。 -脚本作为纯文本存在和执行,并不需要编译执行。 +脚本作为纯文本存在和执行。它们不需要特殊的准备或编译即可运行。 这方面, JavaScript 和 [Java](http://en.wikipedia.org/wiki/Java) 有很大的区别。 ```smart header="Why JavaScript?" -JavaScript 在创建的时候,它的名字叫 “LiveScript”。因为当时 Java 很流行,所以就取了个名字叫 JavaScript。这样就可以让大家认为, JavaScript 是 Java 的弟弟。 +JavaScript 在被创建的时候,它的名字叫 “LiveScript”。但是因为当时 Java 很流行,所以决定将一种新语言定位为 Java 的“弟弟”会有所帮助。 -随着 JavaScript 的发展,它已经变成了一门独立的语言,同时也有了自己的语言规范 [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript)。现在,Java 和 JavaScript 已经是两门不同的语言,彼此之前也没有任何关系。 +随着 JavaScript 的发展,它已经变成了一门独立的语言,同时也有了自己的语言规范 [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript)。现在,它和 Java 之间没有任何关系。 ``` 现在,JavaScript 不仅仅是在浏览器内执行,也可以在服务端执行。甚至在存在任意 [JavaScript 引擎](https://en.wikipedia.org/wiki/JavaScript_engine)的环境中都可以执行。 @@ -24,72 +24,60 @@ JavaScript 在创建的时候,它的名字叫 “LiveScript”。因为当时 不同的引擎有不同的名字,例如: -* [V8]() --Chrome 和 Opera 中的 JavaScript 引擎 。 -* [Gecko]() --Firefox 中的 JavaScript 引擎。 -* ... 也有一些其他的 JavaScript 引擎,“Trident” 和 “Chakra” 是不同版本 IE 的 JavaScript 引擎,“ChakraCore” 是 Microsoft - Edge 的 JavaScript 引擎 , “Nitro” 和 “SquirrelFish” 是 Safari 的 JavaScript 引擎,等等。 +* [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- Chrome 和 Opera 中的 JavaScript 引擎 。 +* [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- Firefox 中的 JavaScript 引擎。 +* ... 也有一些其他的 JavaScript 引擎,例如,“Trident” 和 “Chakra” 是不同版本 IE 的 JavaScript 引擎,“ChakraCore” 是 Microsoft Edge 的 JavaScript 引擎 , “Nitro” 和 “SquirrelFish” 是 Safari 的 JavaScript 引擎,等等。 -上面这些很容易记忆,因为经常出现在网上关于开发的文章中。我们也会这样用。例如:某个新的功能,JavaScript 引擎 V8 是支持的 -;那么我们可以认为这个功能在 Chrome 和 Opera 中可以正常运行。 +上面这些很容易记忆,因为经常出现在网上关于开发的文章中。我们也会这样用。例如:某个新的功能,JavaScript 引擎 V8 是支持的,那么我们可以认为这个功能在 Chrome 和 Opera 中可以正常运行。 + +```smart header="引擎是如何工作的?" -```smart header="How the engines work?" 引擎很复杂,但是基本原理很简单。 -1. 脚本是纯文本(可以被压缩)。 -2. 引擎(通常嵌入在浏览器中)读取(理解)这些文本并转化(编译)成机器语言。 +1. 引擎(通常嵌入在浏览器中)读取(“解析”)脚本。 +2. 然后将脚本转化(“编译”)为机器语言。 3. 然后就可以在机器上飞速的运行。 -在每一个阶段,引擎都会做一些优化。引擎甚至会监视脚本的执行,分析数据流,从而采取相应的优化措施。 +引擎会对流程中的每个阶段都进行优化。它甚至可以在运行时监视编译的脚本,分析数据流并根据这些对机器代码应用优化。最后,脚本会执行地非常快。 ``` -## 浏览器中的 JavaScript 能干什么 ? +## 浏览器中的 JavaScript 能做什么 ? -现在的 JavaScript 是一种安全语言。它不会去操作计算机的内存和 CPU。因为 JavaScript 最开始就是为浏览器准备的,浏览器也不需 -要操作这些。 +现代的 JavaScript 是一种“安全”语言。它不提供对内存或 CPU 的底层访问,因为它最初是为浏览器创建的,不需要这些功能。 -JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wikipedia.org/wiki/Node.js) 就可以读写文件,可以发送响应网 -络请求。 +JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wikipedia.org/wiki/Node.js) 允许 JavaScript 读写任意文件、执行网络请求等。 -浏览器中的 JavaScript 只处理和网页相关的操作,处理网页和用户的交互以及网页和服务端的网络请求。 +浏览器中的 JavaScript 可以完成所有和网页相关的操作、处理用户和 Web 服务器之间的交互。 -浏览器中的 JavaScript,可以干下面这些事: +例如,浏览器中的 JavaScript 可以完成下面这些事: * 在网页中插入新的 HTML,修改现有的网页内容和网页的样式。 -* 响应用户的行为,响应鼠标的点击或移动,键盘的敲击。 -* 向远程服务器发送请求,下载或上传文件([AJAX]() 和 - [COMET]()技术)。 -* 获取或修改 cookie,向用访问者发送消息,提问题。 -* 存储浏览器端的一些本地数据(本地存储)。 +* 响应用户的行为,响应鼠标的点击或移动、键盘的敲击。 +* 向远程服务器发送请求,使用 [AJAX](https://en.wikipedia.org/wiki/Ajax_(programming)) 和 [COMET](https://en.wikipedia.org/wiki/Comet_(programming)) 技术下载或上传文件。 +* 获取或修改 cookie,向用访问者提出问题、发送消息。 +* 记住客户端的数据(本地存储)。 -## 浏览器中的 JavaScript **不**能干什么? +## 浏览器中的 JavaScript 不能做什么? 为了用户的(信息)安全,在浏览器中的 JavaScript 的能力是有限的。这样主要是为了阻止邪恶的网站获得或修改用户的私人数据。 -例如: - -* 网页中的 JavaScript 不能读、写、复制及执行用户磁盘上的文件或程序。也不能直接控制操作系统。 - - 现代浏览器允许 JavaScript 做一些文件相关的操作,但是这个操作是受到限制的。仅当用户使用某个特定的动作,JavaScript 才能 - 操作这个文件。例如,把文件 “ 拖 ” 到浏览器中,或者通过 `` 标签选择文件。 +这些限制的例子有: - JavaScript 有很多方式和设备的照相机 / 麦克风交互,这些都需要提前获得用户的允许。所以,JavaScript 并不会偷偷的通过你的 - 摄像头观察你,更不会把你的信息发送到 [NSA](https://en.wikipedia.org/wiki/National_Security_Agency)。 +* 网页中的 JavaScript 不能读、写、复制及执行用户磁盘上的文件或程序。它没有直接访问 os 系统的功能。 -- 不同的浏览器标签页基本彼此不相关。有时候,也会有一些关系。例如,通过 JavaScript 打开另外一个新的标签页。如果两个标签页 - 打开的不是同一个网站,他们不能够相互通信(域名、协议或者端口任一不相同的网站,都认为是不同的网站)。 + 现代浏览器允许 JavaScript 做一些文件相关的操作,但是这个操作是受到限制的。仅当用户使用某个特定的动作,JavaScript 才能操作这个文件。例如,把文件 “拖” 到浏览器中,或者通过 `` 标签选择文件。 - 这就是 “ 同源策略 ”。为了解决不同标签页交互的问题,两个同源的网站必须**都**包含特殊的 JavaScript 代码,才能够实现数据 - 交换。 + JavaScript 有很多方式和设备的照相机 / 麦克风交互,但是这些都需要提前获得用户的允许。所以,JavaScript 并不会偷偷的通过你的摄像头观察你,更不会把你的信息发送到 [NSA](https://en.wikipedia.org/wiki/National_Security_Agency)。 +- 不同的浏览器标签页基本彼此不相关。有时候,也会有一些关系。例如,通过 JavaScript 打开另外一个新的标签页。但即使在这种情况下,如果两个标签页打开的不是同一个网站(域名、协议或者端口任一不相同的网站),他们都不能够相互通信。 - 这个限制也是为了用户的信息安全。例如,来自 `http://anysite.com` 的网页的 JavaScript 不能够获取任何 - `http://gmail.com`(另外一个标签页打开的网页)页面的数据。 + 这就是 “同源策略”。为了解决不同标签页交互的问题,两个同源的网站必须**都**包含一些特殊的 JavaScript 代码,才能够实现数据交换。 -- JavaScript 通过互联网可以很容易的和服务器通讯(当前网页域名的服务器)通讯。但是从其他的服务器中获取数据的功能是受限的 - ,需要(在 HTTP 头中)添加某些参数。这也是为了用户的数据安全。 + 这个限制也是为了用户的信息安全。例如,用户打开的 `http://anysite.com` 网页的 JavaScript 不能访问 `http://gmail.com`(另外一个标签页打开的网页)也不能从那里窃取信息。 +- JavaScript 通过互联网可以很容易的和服务器通讯(当前网页域名的服务器)通讯。但是从其他的服务器中获取数据的功能是受限的,需要(在 HTTP 头中)添加某些参数。这也是为了用户的数据安全。 ![](limitations.png) -非浏览器中的 JavaScript ,一般没有这些限制。例如服务端的 JavaScript 就没有这些限制。现代浏览器还允许通过 JavaScript 来安装浏览器插件或扩展,当然这也是在用户授权的前提下。 +浏览器环境外的 JavaScript 一般没有这些限制。例如服务端的 JavaScript 就没有这些限制。现代浏览器还允许通过 JavaScript 来安装浏览器插件或扩展,当然这也是在用户授权的前提下。 ## JavaScript 为什么与众不同? @@ -103,11 +91,11 @@ JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wik 满足这三条的浏览器技术也只有 JavaScript 了。 -这就是为什么 JavaScript 与众不同!这也是为什么大家都通过 JavaScript 来跟浏览器交互。 +这就是为什么 JavaScript 与众不同!这也是为什么它是创建浏览器界面的最普遍的工具。 -当然,学习一项新技术的时候,最好先看一下他的前景。所以,接下来,我们来看看新的趋势(包含一些新的语言)。 +当然,学习一项新技术的时候,最好先看一下它的前景。所以,接下来我们继续讨论包括新语言和浏览器功能在内的现代趋势。 -## 比 JavaScript “ 好 ” 的语言 +## 比 JavaScript “好” 的语言 不同的人喜欢不同的功能,JavaScript 的语法也不能够满足所有人。 @@ -115,13 +103,13 @@ JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wik 所以,最近出现了很多不同的语言,这些语言在浏览器中执行之前,都会被**编译**(转化)成 JavaScript。 -现代的工具编译得很快,并且让用户不可感知。这就允许开发中使用一种新的语言,就和使用 JavaScript 一样。 +现代化的工具使得编译速度非常快速和透明,实际上允许开发人员使用另一种语言编写代码并将其自动转换为 JavaScript。。 -例如: +这些语言的例子有: -* [CoffeeScript](http://coffeescript.org/) 是 JavaScript 的语法糖,他语法简短,精确简捷。通常使用 Ruby 的人喜欢用。 +* [CoffeeScript](http://coffeescript.org/) 是 JavaScript 的语法糖,它语法简短,精确简捷。通常使用 Ruby 的人喜欢用。 * [TypeScript](http://www.typescriptlang.org/) 主要是是添加了严格类型系统。这样就能简化开发,也能用于开发复杂的系统。TypeScript 是微软开发的。 -* [Dart](https://www.dartlang.org/) 是一门独立的语言。他拥有自己的引擎,在非浏览器环境中运行(如:在手机应用中运行)。最开始是 Google 提供的用于替代 JavaScript 的,但是现在,浏览器也需要它和上面的语言一样需要被编译成 JavaScript 。 +* [Dart](https://www.dartlang.org/) 是一门独立的语言。它拥有自己的引擎用于在非浏览器环境中运行(如:在手机应用中运行)。最开始是 Google 提供的用于替代 JavaScript 的,但是现在,浏览器也需要它和上面的语言一样需要被编译成 JavaScript 。 当然,还有更多其他的语言。即使我们在使用这些语言,我们也需要知道 JavaScript。因为学习 JavaScript 可以让我们真正明白我们自己在做什么。 From 29bde392c7d51e6edada552e85ad2e4f50119d80 Mon Sep 17 00:00:00 2001 From: sqrtthree Date: Thu, 12 Apr 2018 14:33:08 +0800 Subject: [PATCH 4/9] chore(intro): ready for review --- 1-js/01-getting-started/1-intro/article.md | 29 +++++++++++----------- 1 file changed, 15 insertions(+), 14 deletions(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index 289969d98e..da9184cd20 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -24,9 +24,9 @@ JavaScript 在被创建的时候,它的名字叫 “LiveScript”。但是因 不同的引擎有不同的名字,例如: -* [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- Chrome 和 Opera 中的 JavaScript 引擎 。 -* [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- Firefox 中的 JavaScript 引擎。 -* ... 也有一些其他的 JavaScript 引擎,例如,“Trident” 和 “Chakra” 是不同版本 IE 的 JavaScript 引擎,“ChakraCore” 是 Microsoft Edge 的 JavaScript 引擎 , “Nitro” 和 “SquirrelFish” 是 Safari 的 JavaScript 引擎,等等。 +- [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- Chrome 和 Opera 中的 JavaScript 引擎 。 +- [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- Firefox 中的 JavaScript 引擎。 +- ... 也有一些其他的 JavaScript 引擎,例如,“Trident” 和 “Chakra” 是不同版本 IE 的 JavaScript 引擎,“ChakraCore” 是 Microsoft Edge 的 JavaScript 引擎 , “Nitro” 和 “SquirrelFish” 是 Safari 的 JavaScript 引擎,等等。 上面这些很容易记忆,因为经常出现在网上关于开发的文章中。我们也会这样用。例如:某个新的功能,JavaScript 引擎 V8 是支持的,那么我们可以认为这个功能在 Chrome 和 Opera 中可以正常运行。 @@ -51,11 +51,11 @@ JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wik 例如,浏览器中的 JavaScript 可以完成下面这些事: -* 在网页中插入新的 HTML,修改现有的网页内容和网页的样式。 -* 响应用户的行为,响应鼠标的点击或移动、键盘的敲击。 -* 向远程服务器发送请求,使用 [AJAX](https://en.wikipedia.org/wiki/Ajax_(programming)) 和 [COMET](https://en.wikipedia.org/wiki/Comet_(programming)) 技术下载或上传文件。 -* 获取或修改 cookie,向用访问者提出问题、发送消息。 -* 记住客户端的数据(本地存储)。 +- 在网页中插入新的 HTML,修改现有的网页内容和网页的样式。 +- 响应用户的行为,响应鼠标的点击或移动、键盘的敲击。 +- 向远程服务器发送请求,使用 [AJAX](https://en.wikipedia.org/wiki/Ajax_(programming)) 和 [COMET](https://en.wikipedia.org/wiki/Comet_(programming)) 技术下载或上传文件。 +- 获取或修改 cookie,向用访问者提出问题、发送消息。 +- 记住客户端的数据(本地存储)。 ## 浏览器中的 JavaScript 不能做什么? @@ -95,6 +95,7 @@ JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wik 当然,学习一项新技术的时候,最好先看一下它的前景。所以,接下来我们继续讨论包括新语言和浏览器功能在内的现代趋势。 + ## 比 JavaScript “好” 的语言 不同的人喜欢不同的功能,JavaScript 的语法也不能够满足所有人。 @@ -107,14 +108,14 @@ JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wik 这些语言的例子有: -* [CoffeeScript](http://coffeescript.org/) 是 JavaScript 的语法糖,它语法简短,精确简捷。通常使用 Ruby 的人喜欢用。 -* [TypeScript](http://www.typescriptlang.org/) 主要是是添加了严格类型系统。这样就能简化开发,也能用于开发复杂的系统。TypeScript 是微软开发的。 -* [Dart](https://www.dartlang.org/) 是一门独立的语言。它拥有自己的引擎用于在非浏览器环境中运行(如:在手机应用中运行)。最开始是 Google 提供的用于替代 JavaScript 的,但是现在,浏览器也需要它和上面的语言一样需要被编译成 JavaScript 。 +- [CoffeeScript](http://coffeescript.org/) 是 JavaScript 的语法糖,它语法简短,精确简捷。通常使用 Ruby 的人喜欢用。 +- [TypeScript](http://www.typescriptlang.org/) 主要是是添加了严格类型系统。这样就能简化开发,也能用于开发复杂的系统。TypeScript 是微软开发的。 +- [Dart](https://www.dartlang.org/) 是一门独立的语言。它拥有自己的引擎用于在非浏览器环境中运行(如:在手机应用中运行)。最开始是 Google 提供的用于替代 JavaScript 的,但是现在,浏览器也需要它和上面的语言一样需要被编译成 JavaScript 。 当然,还有更多其他的语言。即使我们在使用这些语言,我们也需要知道 JavaScript。因为学习 JavaScript 可以让我们真正明白我们自己在做什么。 ## 总结 -* JavaScript 最开始是为浏览器设计的一门语言,但是现在也可以在其它的环境中运行。 -* 现在,JavaScript 是一门在浏览中使用最广、并且能够很好集成 HTML/CSS 的语言。 -* 有很多其他的语言可以编译成 JavaScript,这些语言还提供更多的功能。最好要了解一下这些语言,至少在掌握 JavaScript 之后,需要简单的看一下。 +- JavaScript 最开始是为浏览器设计的一门语言,但是现在也可以在其它的环境中运行。 +- 现在,JavaScript 是一门在浏览中使用最广、并且能够很好集成 HTML/CSS 的语言。 +- 有很多其他的语言可以编译成 JavaScript,这些语言还提供更多的功能。最好要了解一下这些语言,至少在掌握 JavaScript 之后,需要简单的看一下。 From 79ab1e23ff637d2f37b0c2e8e4cb7b95deaa5a54 Mon Sep 17 00:00:00 2001 From: sqrtthree Date: Thu, 12 Apr 2018 15:00:34 +0800 Subject: [PATCH 5/9] fix(code-editors): Adjust some contents --- .../2-code-editors/article.md | 60 +++++++------------ 1 file changed, 22 insertions(+), 38 deletions(-) diff --git a/1-js/01-getting-started/2-code-editors/article.md b/1-js/01-getting-started/2-code-editors/article.md index d3f4e77c89..e27d2b14d1 100644 --- a/1-js/01-getting-started/2-code-editors/article.md +++ b/1-js/01-getting-started/2-code-editors/article.md @@ -4,69 +4,53 @@ 编辑器主要分两种:IDE(集成开发环境) 和轻量编辑器。很多人喜欢这两种各选一个。 -[cut] - ## IDE -[IDE](https://en.wikipedia.org/wiki/Integrated_development_environment) (集成开发环境) 是用于管理整个项目具有强大功能 -的编辑器。也就是说,不仅仅是编辑器,而且还是开发环境。 +[IDE](https://en.wikipedia.org/wiki/Integrated_development_environment)(集成开发环境)是用于管理整个项目具有强大功能的编辑器。顾名思义,它不仅仅是一个编辑器,而且还是开发环境。 -IDE 加载项目(通常包含多个文件),并且允许在不同文件之间切换。IDE 还提供基于项目的自动补全功能,集成版本控制,集成测试环 -境等一些其他用于开发的东西。 +IDE 加载项目(通常包含多个文件),并且允许在不同文件之间切换。IDE 还提供基于项目的自动补全功能,集成版本控制、集成测试环境等一些其他“项目层面”的东西。 如果你还没考虑好选哪一款 IDE,看看下面: -* IntelliJ editors: [WebStorm](http://www.jetbrains.com/webstorm/) 供前端开发使用。 除了前端,如果你们还需要使用其他语言 - ,那么可以考虑 [PHPStorm (PHP)](http://www.jetbrains.com/phpstorm/), - [IDEA (Java)](http://www.jetbrains.com/idea/),[RubyMine (Ruby)](http://www.jetbrains.com/ruby/) 。 - -* Visual Studio 一般 .NET 开发者喜欢用。 -* 基于 Eclipse 的产品,例如 : [Aptana](http://www.aptana.com/) 和 Zend Studio。 -* [Komodo IDE](http://www.activestate.com/komodo-ide) 以及他的轻量版 - [Komodo Edit](http://www.activestate.com/komodo-edit)。 -* [Netbeans](http://netbeans.org/)。 +- 专为前端开发而生的 [WebStorm](http://www.jetbrains.com/webstorm/),如果你需要额外的语言支持也可以选择这家公司的其他编辑器。 +- 如果你是一个 .NET 开发者,Visual Studio 也是一个好的选择,还有一个免费版 —— ([Visual Studio Community](https://www.visualstudio.com/vs/community/)) +- [Netbeans](http://netbeans.org/). -除了 Visual Studio,以上这些 IDE 都是跨平台的。Visual Studio 现在有 Mac 版本和 Windows 版本的。 +除了 Visual Studio,以上这些 IDE 都是跨平台的。Visual Studio 无法在 Linux 上使用。 -大多数 IDE 是收费的,但是他们都可以试用。这些费用对于一个合格的程序员来说,肯定算不了什么,所有还是选一个最好的。 +大多数 IDE 是收费的,但是他们都可以试用。这些费用对于一个合格的程序员的薪水来说,肯定算不了什么,所有去选一个对你来说最好的吧。 ## 轻量编辑器 -“ 轻量编辑器 ” 没有 IDE 那么功能强大,但是他们一般很快,简单,而且优雅。 +“轻量编辑器” 没有 IDE 那么功能强大,但是他们一般很快、优雅而且简单。 -“ 轻量编辑器 ” 主要用于立即打开编辑一个文件。 +“轻量编辑器” 主要用于立即打开编辑一个文件。 -“ 轻量编辑器 ” 和 IDE 有很大的区别。IDE 一般是项目中使用,就意味着一开始要加载很多数据,并且在使用的过程中会分析项目的结 -构和内容。如果我们只需要编辑一个文件,那么 “ 轻量编辑器 ” 会更快的帮我们打开文件。 +“轻量编辑器” 和 IDE 有很大的区别。IDE 一般是项目中使用,就意味着一开始要加载很多数据,并且在使用的过程中会分析项目的结构和内容。如果我们只需要编辑一个文件,那么 “轻量编辑器” 会更快的帮我们打开文件。 -实际上,“ 轻量编辑器 ” 一般都有各种各样的插件,这些插件可以做语法分析,可以补全代码。所以 “ 轻量编辑器 ” 和 IDE 也没有严 -格的界限。 +实际上,“轻量编辑器”一般都有各种各样的插件,这些插件可以做语法分析和补全代码。所以 “轻量编辑器” 和 IDE 也没有严格的界限。 -下面是一些流行的 “ 轻量编辑器 ”: +下面是一些流行的 “轻量编辑器”: -* [Visual Studio Code](https://code.visualstudio.com/)(跨平台,免费)。 -* [Atom](https://atom.io/)(跨平台,免费)。 -* [Sublime Text](http://www.sublimetext.com)(跨平台,共享软件)。 -* [Notepad++](https://notepad-plus-plus.org/)(Windows, 免费)。 -* Vim, Emacs 很棒 , 如果你们知道怎么用得话。 +- [Visual Studio Code](https://code.visualstudio.com/)(跨平台、免费)。 +- [Atom](https://atom.io/)(跨平台、免费)。 +- [Sublime Text](http://www.sublimetext.com)(跨平台、共享软件)。 +- [Notepad++](https://notepad-plus-plus.org/)(Windows、免费)。 +- [Vim](http://www.vim.org/) 和 [Emacs](https://www.gnu.org/software/emacs/) 很棒,前提是如果你知道怎么用。 ## 我喜欢的 -项目开发我一般用 IDE,编辑个别文件我会用 “ 轻量编辑器 ”。 +我个人喜好是同时拥有项目级别的 IDE 和轻量级的编辑器,以便快速轻松地进行文件编辑。 我使用的编辑器: -* IDE-- [WebStorm](http://www.jetbrains.com/webstorm/) 写 JS, 如果项目涉及其他语言我会选择 - [PHPStorm](http://www.jetbrains.com/phpstorm/) (PHP), [IDEA](http://www.jetbrains.com/idea/) (Java), - [RubyMine](http://www.jetbrains.com/ruby/)(Ruby)。 对于其他的语言还有一些其他的编辑器,不过我只用过上面的这几款。 -* 轻量编辑器 -- [Sublime Text](http://www.sublimetext.com)或[Atom](https://atom.io/)。 - -如果你们不知道怎么选,可以考虑考虑这些。 +- 使用 [WebStorm](http://www.jetbrains.com/webstorm/) 写 JS,如果项目涉及其他语言我切换到上面列出的其他 Jetbrains 产品之一。 +- 轻量编辑器 -- [Sublime Text](http://www.sublimetext.com) 或 [Atom](https://atom.io/)。 ## 不要争吵 -上面列举的这些编辑器,一般是我或者我的朋友在使用的。 +上面列表中的编辑都是那些我或我的朋友(他们都是我认为很优秀的开发人员)已经使用了很长时间并且很满意的。 世上还有很多其他的很好的编辑器,你们可以选择一个你们最喜欢的。 -选择编辑器就像选择其他工具一样。要看个人的习惯,个人的喜好,以及开发的项目。 +选择编辑器就像选择其他工具一样。要看你的项目,以及个人的习惯、喜好。 From 6a4798a3e0278290c194bf6e426e6e80e05c4d79 Mon Sep 17 00:00:00 2001 From: sqrtthree Date: Thu, 12 Apr 2018 15:17:16 +0800 Subject: [PATCH 6/9] fix(devtools): Adjust some contents --- 1-js/01-getting-started/3-devtools/article.md | 44 +++++++++---------- 1 file changed, 20 insertions(+), 24 deletions(-) diff --git a/1-js/01-getting-started/3-devtools/article.md b/1-js/01-getting-started/3-devtools/article.md index c37ceb7e50..d73c3478fe 100644 --- a/1-js/01-getting-started/3-devtools/article.md +++ b/1-js/01-getting-started/3-devtools/article.md @@ -1,24 +1,20 @@ # 开发者控制台 -代码有错误。你的代码好像有错误 ...... 哦,我在说什么?只要你是人,你一定会犯错误(在写代码的时候),除非你是[机器人]()。 +代码是很容易出现错误的。你也很可能犯错误...... 哦,我在说什么?只要你是人,你一定会犯错误(在写代码的时候),除非你是[机器人](https://en.wikipedia.org/wiki/Bender_(Futurama))。 -但在浏览器中,用户默认是看不到错误的。所以,如果脚本中有错误,我们看不到是什么错误,更不能够修复。 +但在浏览器中,默认情况下用户是看不到错误的。所以,如果脚本中有错误,我们看不到是什么错误,更不能够修复。 -为了发现错误和获得一些与脚本相关且有用的信息,浏览器嵌入了 “ 开发者工具 ”。 +为了发现错误并获得一些与脚本相关且有用的信息,浏览器内置了 “开发者工具”。 -通常,开发者倾向于使用 Chrome 或 Firefox 来开发,是因为他们有最好的开发者工具。一些其他的浏览器也提供开发者工具,有时还 -具有一些特殊的功能,通常他们都是在追赶 Chrome 或 Firefox。所以大多数人都有 “ 最喜欢 ” 的浏览器,当遇到某个浏览器独有的问 -题的时候,人们就会切换到其他的浏览器。 +通常,开发者倾向于使用 Chrome 或 Firefox 来开发,因为它们有最好的开发者工具。一些其他的浏览器也提供开发者工具,有时还具有一些特殊的功能,通常他们都是在追赶 Chrome 或 Firefox。所以大多数人都有 “最喜欢” 的浏览器,当遇到某个浏览器独有的问题的时候,人们就会切换到其他的浏览器。 -开发者工具很强大,功能丰富。刚开始,我们要学习如何打开他们,查找错误,执行 JavaScript 命令。 - -[cut] +开发者工具很强大,功能丰富。首先,我们要学习如何打开他们,查找错误和运行 JavaScript 命令。 ## Google Chrome 打开网页 [bug.html](bug.html)。 -有个错误在 JavaScript 代码中。一般的访问者看不到这个错误,所以,让我们打开开发者工具看看。 +在 JavaScript 代码中有一个错误。一般的访问者看不到这个错误,所以让我们打开开发者工具看看吧。 按下 `key:F12` 键, 如果你使用 Mac, 试试 `key:Cmd+Opt+J`。 @@ -30,33 +26,33 @@ 具体什么样,要看你的 Chrome 版本。它随着时间一直在变,但是都很类似。 -* 这个上面,我们能看到红色的错误信息。这个场景中,脚本里有一个未知的 “lalala” 命令。 -* 在右边,有个可点击的链接 `bug.html:12`。这个链接会链接到错误发生的行号。 +- 这个上面,我们能看到红色的错误信息。这个场景中,脚本里有一个未知的 “lalala” 命令。 +- 在右边,有个可点击的链接 `bug.html:12`。这个链接会链接到错误发生的行号。 -在错误信息的下方,有个 `>` 标志。它代表 “ 命令行 ”,在 “ 命令行 ” 中,我们可以输入 JavaScript 命令,按下 `key:Enter` 来 -执行 ( `key:Shift+Enter` 用来输入多行命令 )。 +在错误信息的下方,有个 `>` 标志。它代表 “命令行 ”,在 “命令行” 中,我们可以输入 JavaScript 命令,按下 `key:Enter` 来 +执行(`key:Shift+Enter` 用来输入多行命令)。 现在,我们能看到错误就够了。稍后,在 章节中,我们会重新更加深入的讨论开发者工具。 -## Firefox, Edge 和其他 +## Firefox、Edge 和其他 + +大多数其他的浏览器都是通过 `key:F12` 来打开开发者工具。 -大多数其他的浏览器都是通过 `key:F12` 来打开开发者工具。他们的外观和感觉都非常相似,一旦你学会了他们中的一个(可以先尝试 -Chrome),其他的也就很快了。 +他们的外观和感觉都非常相似,一旦你学会了他们中的一个(可以先尝试 Chrome),其他的也就很快了。 ## Safari -Safari ( Mac 系统中浏览器 , 不支持 Windows 和 Linux 系统 ) 有一点点不同。我们需要先开启 “ 开发菜单 ”。 +Safari(Mac 系统中浏览器,不支持 Windows 和 Linux 系统)有一点点不同。我们需要先开启 “开发菜单”。 -打开 “ 偏好设置 ...”, 点 “ 高级 ”。选中最下方的那个选择框。 +打开 “偏好设置”,选择“高级”选项。选中最下方的那个选择框。 ![safari](safari.png) -现在,我们通过 `key:Cmd+Opt+C` 就能打开或关闭控制台了。另外注意,名字为 “ 开发 ” 的顶部菜单出现了。有很多命令和选项。 +现在,我们通过 `key:Cmd+Opt+C` 就能打开或关闭控制台了。另外注意,有一个名字为 “开发” 的顶部菜单出现了。它有很多命令和选项。 ## 总结 -* 开发者工具允许我们查看错误,执行命令 ( 脚本 ),检查变量等等。 -* 在 Windows 系统中,可以通过 `key:F12` 开启开发者工具。Mac 系统下,Chrome 需要使用 `key:Cmd+Opt+J`,Safari 使用 - `key:Cmd+Opt+C` ( 需要提前开启 )。 +* 开发者工具允许我们查看错误、执行命令、检查变量等等。 +* 在 Windows 系统中,可以通过 `key:F12` 开启开发者工具。Mac 系统下,Chrome 需要使用 `key:Cmd+Opt+J`,Safari 使用 `key:Cmd+Opt+C`(需要提前开启)。 -现在我们的环境准备好了,下一章,我看开始 JavaScript。 +现在我们的环境准备好了,下一章,我们将开始讨论 JavaScript。 From 6229e17f90ecd61f174d2465e51be590248934c8 Mon Sep 17 00:00:00 2001 From: sqrtthree Date: Sun, 22 Apr 2018 18:34:23 +0800 Subject: [PATCH 7/9] :ok_hand: fix: Adjust some words due to code review changes Signed-off-by: sqrtthree --- 1-js/01-getting-started/1-intro/article.md | 30 +++++++++---------- .../2-code-editors/article.md | 10 +++---- 2 files changed, 20 insertions(+), 20 deletions(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index da9184cd20..a7b9c8a03d 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -6,29 +6,29 @@ **JavaScript** 最初的目的是为了 **“让网页动起来”**。 -这种编程语言我们称之为**脚本**。把它们正确编写到 HTML 当中,在页面加载的时候会自动执行。 +这种编程语言我们称之为**脚本**。它们可以写在 HTML 中,在页面加载的时候会自动执行。 脚本作为纯文本存在和执行。它们不需要特殊的准备或编译即可运行。 这方面, JavaScript 和 [Java](http://en.wikipedia.org/wiki/Java) 有很大的区别。 ```smart header="Why JavaScript?" -JavaScript 在被创建的时候,它的名字叫 “LiveScript”。但是因为当时 Java 很流行,所以决定将一种新语言定位为 Java 的“弟弟”会有所帮助。 +JavaScript 在刚诞生的时候,它的名字叫 “LiveScript”。但是因为当时 Java 很流行,所以决定将一种新语言定位为 Java 的“弟弟”会有所帮助。 随着 JavaScript 的发展,它已经变成了一门独立的语言,同时也有了自己的语言规范 [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript)。现在,它和 Java 之间没有任何关系。 ``` -现在,JavaScript 不仅仅是在浏览器内执行,也可以在服务端执行。甚至在存在任意 [JavaScript 引擎](https://en.wikipedia.org/wiki/JavaScript_engine)的环境中都可以执行。 +现在,JavaScript 不仅仅是在浏览器内执行,也可以在服务端执行。甚至在任意搭载了 [JavaScript 引擎](https://en.wikipedia.org/wiki/JavaScript_engine) 的环境中都可以执行。 浏览器中嵌入了 JavaScript 引擎,有时也称作 JavaScript 虚拟机。 不同的引擎有不同的名字,例如: -- [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- Chrome 和 Opera 中的 JavaScript 引擎 。 +- [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- Chrome 和 Opera 中的 JavaScript 引擎。 - [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- Firefox 中的 JavaScript 引擎。 - ... 也有一些其他的 JavaScript 引擎,例如,“Trident” 和 “Chakra” 是不同版本 IE 的 JavaScript 引擎,“ChakraCore” 是 Microsoft Edge 的 JavaScript 引擎 , “Nitro” 和 “SquirrelFish” 是 Safari 的 JavaScript 引擎,等等。 -上面这些很容易记忆,因为经常出现在网上关于开发的文章中。我们也会这样用。例如:某个新的功能,JavaScript 引擎 V8 是支持的,那么我们可以认为这个功能在 Chrome 和 Opera 中可以正常运行。 +上面这些很容易记忆,因为经常出现在网上关于开发的文章中。我们也会这样用。例如:某个新的功能,如果 JavaScript 引擎 V8 是支持的,那么我们可以认为这个功能在 Chrome 和 Opera 中可以正常运行。 ```smart header="引擎是如何工作的?" @@ -45,7 +45,7 @@ JavaScript 在被创建的时候,它的名字叫 “LiveScript”。但是因 现代的 JavaScript 是一种“安全”语言。它不提供对内存或 CPU 的底层访问,因为它最初是为浏览器创建的,不需要这些功能。 -JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wikipedia.org/wiki/Node.js) 允许 JavaScript 读写任意文件、执行网络请求等。 +JavaScript 的能力依赖于它执行的环境。例如:[Node.js](https://wikipedia.org/wiki/Node.js) 允许 JavaScript 读写任意文件、执行网络请求等。 浏览器中的 JavaScript 可以完成所有和网页相关的操作、处理用户和 Web 服务器之间的交互。 @@ -63,17 +63,17 @@ JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wik 这些限制的例子有: -* 网页中的 JavaScript 不能读、写、复制及执行用户磁盘上的文件或程序。它没有直接访问 os 系统的功能。 +* 网页中的 JavaScript 不能读、写、复制及执行用户磁盘上的文件或程序。它没有直接访问操作系统的功能。 现代浏览器允许 JavaScript 做一些文件相关的操作,但是这个操作是受到限制的。仅当用户使用某个特定的动作,JavaScript 才能操作这个文件。例如,把文件 “拖” 到浏览器中,或者通过 `` 标签选择文件。 - JavaScript 有很多方式和设备的照相机 / 麦克风交互,但是这些都需要提前获得用户的允许。所以,JavaScript 并不会偷偷的通过你的摄像头观察你,更不会把你的信息发送到 [NSA](https://en.wikipedia.org/wiki/National_Security_Agency)。 -- 不同的浏览器标签页基本彼此不相关。有时候,也会有一些关系。例如,通过 JavaScript 打开另外一个新的标签页。但即使在这种情况下,如果两个标签页打开的不是同一个网站(域名、协议或者端口任一不相同的网站),他们都不能够相互通信。 + JavaScript 有很多方式和设备的照相机/麦克风交互,但是这些都需要提前获得用户的授权许可。所以,JavaScript 并不会偷偷的通过你的摄像头观察你,更不会把你的信息发送到[美国国家安全局](https://en.wikipedia.org/wiki/National_Security_Agency)。 +- 不同的浏览器标签页之间基本彼此不相关。有时候,也会有一些关系。例如,通过 JavaScript 打开另外一个新的标签页。但即使在这种情况下,如果两个标签页打开的不是同一个网站(域名、协议或者端口任一不相同的网站),他们都不能够相互通信。 这就是 “同源策略”。为了解决不同标签页交互的问题,两个同源的网站必须**都**包含一些特殊的 JavaScript 代码,才能够实现数据交换。 这个限制也是为了用户的信息安全。例如,用户打开的 `http://anysite.com` 网页的 JavaScript 不能访问 `http://gmail.com`(另外一个标签页打开的网页)也不能从那里窃取信息。 -- JavaScript 通过互联网可以很容易的和服务器通讯(当前网页域名的服务器)通讯。但是从其他的服务器中获取数据的功能是受限的,需要(在 HTTP 头中)添加某些参数。这也是为了用户的数据安全。 +- JavaScript 通过互联网可以很容易的和服务器(当前网页域名的服务器)通讯。但是从其他的服务器中获取数据的功能是受限的,需要服务器(在 HTTP 头中)添加某些参数。这也是为了用户的数据安全。 ![](limitations.png) @@ -85,7 +85,7 @@ JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wik ```compare + 和 HTML/CSS 完全的集成。 -+ 使用简单的工具(语言)完成简单的任务。 ++ 使用简单的工具完成简单的任务。 + 被所有的主流浏览器支持,并且默认开启。 ``` @@ -104,13 +104,13 @@ JavaScript 的能力依赖于它执行的环境。例如:[Node.JS](https://wik 所以,最近出现了很多不同的语言,这些语言在浏览器中执行之前,都会被**编译**(转化)成 JavaScript。 -现代化的工具使得编译速度非常快速和透明,实际上允许开发人员使用另一种语言编写代码并将其自动转换为 JavaScript。。 +现代化的工具使得编译速度非常快速和透明,实际上允许开发人员使用另一种语言编写代码并将其自动转换为 JavaScript。 这些语言的例子有: -- [CoffeeScript](http://coffeescript.org/) 是 JavaScript 的语法糖,它语法简短,精确简捷。通常使用 Ruby 的人喜欢用。 -- [TypeScript](http://www.typescriptlang.org/) 主要是是添加了严格类型系统。这样就能简化开发,也能用于开发复杂的系统。TypeScript 是微软开发的。 -- [Dart](https://www.dartlang.org/) 是一门独立的语言。它拥有自己的引擎用于在非浏览器环境中运行(如:在手机应用中运行)。最开始是 Google 提供的用于替代 JavaScript 的,但是现在,浏览器也需要它和上面的语言一样需要被编译成 JavaScript 。 +- [CoffeeScript](http://coffeescript.org/) 是 JavaScript 的语法糖,它语法简短,明确简洁。通常使用 Ruby 的人喜欢用。 +- [TypeScript](http://www.typescriptlang.org/) 将注意力集中在增加严格的数据类型。这样就能简化开发,也能用于开发复杂的系统。TypeScript 是微软开发的。 +- [Dart](https://www.dartlang.org/) 是一门独立的语言。它拥有自己的引擎用于在非浏览器环境中运行(如:在手机应用中运行)。最开始是 Google 提供的用于替代 JavaScript 的,但是现在,它和其他上述的语言一样,浏览器也要求它被编译成 JavaScript 。 当然,还有更多其他的语言。即使我们在使用这些语言,我们也需要知道 JavaScript。因为学习 JavaScript 可以让我们真正明白我们自己在做什么。 diff --git a/1-js/01-getting-started/2-code-editors/article.md b/1-js/01-getting-started/2-code-editors/article.md index e27d2b14d1..fcca83291f 100644 --- a/1-js/01-getting-started/2-code-editors/article.md +++ b/1-js/01-getting-started/2-code-editors/article.md @@ -1,8 +1,8 @@ # 编辑器 -程序员接触时间最长的就是代码编辑器 (后面简称编辑器)。 +程序员接触时间最长的就是代码编辑器(后面简称编辑器)。 -编辑器主要分两种:IDE(集成开发环境) 和轻量编辑器。很多人喜欢这两种各选一个。 +编辑器主要分两种:IDE(集成开发环境)和轻量编辑器。很多人喜欢这两种各选一个。 ## IDE @@ -38,19 +38,19 @@ IDE 加载项目(通常包含多个文件),并且允许在不同文件之 - [Notepad++](https://notepad-plus-plus.org/)(Windows、免费)。 - [Vim](http://www.vim.org/) 和 [Emacs](https://www.gnu.org/software/emacs/) 很棒,前提是如果你知道怎么用。 -## 我喜欢的 +## 我的最爱 我个人喜好是同时拥有项目级别的 IDE 和轻量级的编辑器,以便快速轻松地进行文件编辑。 我使用的编辑器: -- 使用 [WebStorm](http://www.jetbrains.com/webstorm/) 写 JS,如果项目涉及其他语言我切换到上面列出的其他 Jetbrains 产品之一。 +- 使用 [WebStorm](http://www.jetbrains.com/webstorm/) 写 JavaScript,如果项目涉及其他语言我切换到上面列出的其他 Jetbrains 产品之一。 - 轻量编辑器 -- [Sublime Text](http://www.sublimetext.com) 或 [Atom](https://atom.io/)。 ## 不要争吵 上面列表中的编辑都是那些我或我的朋友(他们都是我认为很优秀的开发人员)已经使用了很长时间并且很满意的。 -世上还有很多其他的很好的编辑器,你们可以选择一个你们最喜欢的。 +世上还有很多其他的很好的编辑器,你们可以选择一个自己最喜欢的。 选择编辑器就像选择其他工具一样。要看你的项目,以及个人的习惯、喜好。 From 30284e77a3de9283e93fdb1fd254420b60ed369b Mon Sep 17 00:00:00 2001 From: LeviDing Date: Sun, 22 Apr 2018 20:06:25 +0800 Subject: [PATCH 8/9] Update article.md --- 1-js/01-getting-started/1-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index a7b9c8a03d..fb23a37689 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -2,7 +2,7 @@ 我们一起来聊一下 JavaScript,用它能做什么,它有哪些特性,以及一些跟它配合使用的技术。 -## 什么是 JavaScript ? +## 什么是 JavaScript? **JavaScript** 最初的目的是为了 **“让网页动起来”**。 From 8ddada3dc86eb8b31473335a3ab0f6568850824b Mon Sep 17 00:00:00 2001 From: LeviDing Date: Sun, 22 Apr 2018 20:10:25 +0800 Subject: [PATCH 9/9] Update article.md --- 1-js/01-getting-started/1-intro/article.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index fb23a37689..d835f361e5 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -4,13 +4,13 @@ ## 什么是 JavaScript? -**JavaScript** 最初的目的是为了 **“让网页动起来”**。 +**JavaScript** 最初的目的是为了**“让网页动起来”**。 这种编程语言我们称之为**脚本**。它们可以写在 HTML 中,在页面加载的时候会自动执行。 脚本作为纯文本存在和执行。它们不需要特殊的准备或编译即可运行。 -这方面, JavaScript 和 [Java](http://en.wikipedia.org/wiki/Java) 有很大的区别。 +这方面,JavaScript 和 [Java](http://en.wikipedia.org/wiki/Java) 有很大的区别。 ```smart header="Why JavaScript?" JavaScript 在刚诞生的时候,它的名字叫 “LiveScript”。但是因为当时 Java 很流行,所以决定将一种新语言定位为 Java 的“弟弟”会有所帮助。 @@ -26,7 +26,7 @@ JavaScript 在刚诞生的时候,它的名字叫 “LiveScript”。但是因 - [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- Chrome 和 Opera 中的 JavaScript 引擎。 - [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- Firefox 中的 JavaScript 引擎。 -- ... 也有一些其他的 JavaScript 引擎,例如,“Trident” 和 “Chakra” 是不同版本 IE 的 JavaScript 引擎,“ChakraCore” 是 Microsoft Edge 的 JavaScript 引擎 , “Nitro” 和 “SquirrelFish” 是 Safari 的 JavaScript 引擎,等等。 +- ... 也有一些其他的 JavaScript 引擎,例如,“Trident” 和 “Chakra” 是不同版本 IE 的 JavaScript 引擎,“ChakraCore” 是 Microsoft Edge 的 JavaScript 引擎,“Nitro” 和 “SquirrelFish” 是 Safari 的 JavaScript 引擎,等等。 上面这些很容易记忆,因为经常出现在网上关于开发的文章中。我们也会这样用。例如:某个新的功能,如果 JavaScript 引擎 V8 是支持的,那么我们可以认为这个功能在 Chrome 和 Opera 中可以正常运行。