You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Web-Dev-For-Beginners/translations/zh/1-getting-started-lessons/1-intro-to-programming-lang.../README.md

216 lines
11 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!--
CO_OP_TRANSLATOR_METADATA:
{
"original_hash": "2dcbb9259dee4f20a4f08d9a1aa2bd4c",
"translation_date": "2025-08-29T14:52:44+00:00",
"source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md",
"language_code": "zh"
}
-->
# 编程语言与开发工具简介
本课将介绍编程语言的基础知识。这里涵盖的主题适用于当今大多数现代编程语言。在“开发工具”部分,您将学习一些对开发者非常有用的软件。
![编程简介](../../../../translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.zh.png)
> 由 [Tomomi Imura](https://twitter.com/girlie_mac) 绘制的手绘笔记
## 课前测验
[课前测验](https://forms.office.com/r/dru4TE0U9n?origin=lprLink)
## 课程简介
在本课中,我们将学习:
- 什么是编程?
- 编程语言的类型
- 程序的基本元素
- 专业开发者常用的软件和工具
> 您可以在 [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) 上学习本课程!
## 什么是编程?
编程(也称为编码)是为计算机或移动设备等设备编写指令的过程。我们使用编程语言来编写这些指令,设备会对其进行解释。这些指令集可能有不同的名称,但*程序*、*计算机程序*、*应用程序app*和*可执行文件*是一些常见的称呼。
一个*程序*可以是任何用代码编写的东西;网站、游戏和手机应用都是程序。虽然可以在不编写代码的情况下创建程序,但底层逻辑仍需设备解释,而这些逻辑很可能是用代码编写的。一个正在*运行*或*执行*代码的程序正在执行指令。您正在使用的设备运行了一个程序,将这篇课程内容显示在您的屏幕上。
✅ 做一点研究:谁被认为是世界上第一位计算机程序员?
## 编程语言
编程语言使开发者能够为设备编写指令。设备只能理解二进制1 和 0而对于*大多数*开发者来说,这并不是一种高效的交流方式。编程语言是人类与计算机之间的交流工具。
编程语言有不同的形式并可能服务于不同的目的。例如JavaScript 主要用于 Web 应用程序,而 Bash 主要用于操作系统。
*低级语言*通常比*高级语言*需要更少的步骤来让设备解释指令。然而高级语言因其可读性和支持性而广受欢迎。JavaScript 就被认为是一种高级语言。
以下代码展示了使用 JavaScript高级语言和 ARM 汇编代码(低级语言)的区别:
```javascript
let number = 10
let n1 = 0, n2 = 1, nextTerm;
for (let i = 1; i <= number; i++) {
console.log(n1);
nextTerm = n1 + n2;
n1 = n2;
n2 = nextTerm;
}
```
```c
area ascen,code,readonly
entry
code32
adr r0,thumb+1
bx r0
code16
thumb
mov r0,#00
sub r0,r0,#01
mov r1,#01
mov r4,#10
ldr r2,=0x40000000
back add r0,r1
str r0,[r2]
add r2,#04
mov r3,r0
mov r0,r1
mov r1,r3
sub r4,#01
cmp r4,#00
bne back
end
```
相信或不相信,*它们的功能是一样的*:打印出前 10 个斐波那契数列。
✅ 斐波那契数列被[定义](https://en.wikipedia.org/wiki/Fibonacci_number)为一组数字,其中每个数字是前两个数字之和,从 0 和 1 开始。前 10 个斐波那契数是 0, 1, 1, 2, 3, 5, 8, 13, 21 和 34。
## 程序的基本元素
程序中的单条指令称为*语句*,通常会有一个字符或行间距标记指令的结束,称为*终止符*。程序如何终止因语言而异。
程序中的语句可能依赖用户或其他地方提供的数据来执行指令。数据可以改变程序的行为,因此编程语言提供了一种临时存储数据的方法,以便稍后使用。这些称为*变量*。变量是指令设备将数据保存在内存中的语句。程序中的变量类似于代数中的变量,它们有唯一的名称,其值可能随时间变化。
有些语句可能不会被设备执行。这通常是开发者有意设计的,或者是由于意外错误导致的。这种对应用程序的控制使其更加健壮和可维护。通常,这种控制的变化发生在满足某些条件时。现代编程中常用的一种控制程序运行的语句是 `if..else` 语句。
✅ 您将在后续课程中学习更多关于这种语句的内容。
## 开发工具
[![开发工具](https://img.youtube.com/vi/69WJeXGBdxg/0.jpg)](https://youtube.com/watch?v=69WJeXGBdxg "开发工具")
> 🎥 点击上方图片观看关于开发工具的视频
在本节中,您将了解一些在开始专业开发旅程时可能非常有用的软件。
**开发环境**是开发者在编写软件时经常使用的一组独特工具和功能。这些工具可能根据开发者的具体需求进行了定制,并可能随着开发者的工作重点、个人项目或使用的编程语言的变化而改变。开发环境因开发者而异。
### 编辑器
编辑器是软件开发中最重要的工具之一。编辑器是您编写代码的地方,有时也是运行代码的地方。
开发者依赖编辑器的几个额外原因:
- *调试*:通过逐行检查代码来发现错误和问题。有些编辑器具有调试功能;这些功能可以根据特定编程语言进行定制和添加。
- *语法高亮*:为代码添加颜色和文本格式,使其更易于阅读。大多数编辑器允许自定义语法高亮。
- *扩展和集成*:为开发者设计的专用工具。这些工具并未内置于基础编辑器中。例如,许多开发者会为代码添加文档以解释其工作原理。他们可能会安装拼写检查扩展来帮助发现文档中的拼写错误。大多数扩展是为特定编辑器设计的,大多数编辑器也提供了搜索可用扩展的方法。
- *自定义*:允许开发者创建适合自己需求的独特开发环境。大多数编辑器都非常可定制,并且可能允许开发者创建自定义扩展。
#### 流行的编辑器和 Web 开发扩展
- [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)
- [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)
- [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare)
- [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
- [Atom](https://atom.io/)
- [spell-check](https://atom.io/packages/spell-check)
- [teletype](https://atom.io/packages/teletype)
- [atom-beautify](https://atom.io/packages/atom-beautify)
- [Sublimetext](https://www.sublimetext.com/)
- [emmet](https://emmet.io/)
- [SublimeLinter](http://www.sublimelinter.com/en/stable/)
### 浏览器
另一个重要工具是浏览器。Web 开发者依赖浏览器查看代码在 Web 上的运行效果。浏览器还用于显示编辑器中编写的网页的视觉元素,例如 HTML。
许多浏览器都带有*开发者工具*DevTools其中包含一组有用的功能和信息帮助开发者收集和捕获有关应用程序的重要信息。例如如果网页出现错误了解错误发生的时间可能会很有帮助。浏览器中的开发者工具可以配置为捕获这些信息。
#### 流行的浏览器和开发者工具
- [Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)
- [Chrome](https://developers.google.com/web/tools/chrome-devtools/)
- [Firefox](https://developer.mozilla.org/docs/Tools)
### 命令行工具
一些开发者更喜欢使用较少图形化界面的方式完成日常任务,他们依赖命令行来实现这一点。编写代码需要大量的打字,一些开发者更喜欢不打断键盘上的工作流。他们会使用键盘快捷键在桌面窗口之间切换、处理不同文件并使用工具。虽然大多数任务可以通过鼠标完成,但使用命令行的一个好处是可以在不切换鼠标和键盘的情况下完成许多任务。命令行的另一个好处是它们可以配置,您可以保存自定义配置,稍后更改它,并将其导入到其他开发机器中。由于开发环境因开发者而异,有些人会避免使用命令行,有些人完全依赖它,还有些人喜欢两者结合使用。
### 流行的命令行选项
命令行选项因操作系统而异。
*💻 = 操作系统预装。*
#### Windows
- [Powershell](https://docs.microsoft.com/powershell/scripting/overview?view=powershell-7/?WT.mc_id=academic-77807-sagibbon) 💻
- [命令行](https://docs.microsoft.com/windows-server/administration/windows-commands/windows-commands/?WT.mc_id=academic-77807-sagibbon)(也称为 CMD💻
- [Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)
- [mintty](https://mintty.github.io/)
#### MacOS
- [终端](https://support.apple.com/guide/terminal/open-or-quit-terminal-apd5265185d-f365-44cb-8b09-71a064a42125/mac) 💻
- [iTerm](https://iterm2.com/)
- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-macos?view=powershell-7/?WT.mc_id=academic-77807-sagibbon)
#### Linux
- [Bash](https://www.gnu.org/software/bash/manual/html_node/index.html) 💻
- [KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)
- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-linux?view=powershell-7/?WT.mc_id=academic-77807-sagibbon)
#### 流行的命令行工具
- [Git](https://git-scm.com/)(大多数操作系统预装 💻)
- [NPM](https://www.npmjs.com/)
- [Yarn](https://classic.yarnpkg.com/en/docs/cli/)
### 文档
当开发者想学习新知识时,他们很可能会查阅文档以了解如何使用某个工具。开发者通常依赖文档指导他们正确使用工具和语言,同时深入了解其工作原理。
#### 流行的 Web 开发文档
- [Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web),由 [Firefox](https://www.mozilla.org/firefox/) 浏览器的发布者 Mozilla 提供
- [Frontend Masters](https://frontendmasters.com/learn/)
- [Web.dev](https://web.dev),由 [Chrome](https://www.google.com/chrome/) 的发布者 Google 提供
- [Microsoft 的开发者文档](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers),适用于 [Microsoft Edge](https://www.microsoft.com/edge)
- [W3 Schools](https://www.w3schools.com/where_to_start.asp)
✅ 做一些研究:现在您已经了解了 Web 开发者的环境,试着将其与 Web 设计师的环境进行比较和对比。
---
## 🚀 挑战
比较一些编程语言。JavaScript 和 Java 有哪些独特的特点COBOL 和 Go 又如何?
## 课后测验
[课后测验](https://ff-quizzes.netlify.app/web/)
## 复习与自学
研究一下程序员可用的不同语言。尝试用一种语言写一行代码,然后用另外两种语言重写它。您学到了什么?
## 作业
[阅读文档](assignment.md)
---
**免责声明**
本文档使用AI翻译服务[Co-op Translator](https://github.com/Azure/co-op-translator)进行翻译。尽管我们努力确保翻译的准确性,但请注意,自动翻译可能包含错误或不准确之处。原始语言的文档应被视为权威来源。对于关键信息,建议使用专业人工翻译。我们对因使用此翻译而产生的任何误解或误读不承担责任。