study note. study from: https://developer.mozilla.org/zh-CN/docs/Learn/JavaScript/First_steps/What_is_JavaScript
一、 什么是JS
高层定义：
有了JS，网页展示的信息不再是简单的静态信息，而是实时的内容更新（i.e. 交互式的地图，滚动播放的视频）
HTML/CSS/JS的层次结构
HTML 会将文本标记，赋予结构和目的
CSS用来装饰，让文本变得更好看
JS用来实现动态行为
二、 它到底可以做什么
2.1 可以做到普通的编程特性
在变量中储存有用的值e.g. 请求客户输入一个变量名，将这个名字输入到name变量中
操作一段文本，e.g.将两个字符串结合起来
运行代码以响应网页中发生的特定事件。
2.2 令人兴奋的功能
应用程序接口 API-Application Programming Interface
API分为两类：
1. ！！文档对象模型DOM(document obj model) e.g. 某个页面出现了一个弹窗，或者显示了一些新内容
2. 地理位置API： 获取地理信息
3. 影音类API： 利用多媒体，在网页中直接播放音乐和影片
– 第三方API- 没有默认嵌入浏览器，一般要从网上获取他们的信息：
1. 推特API： 可以在网站上展示最新推文
2. 谷歌地图API： 可以在网站嵌入定制的API
# 三、 JS在页面上做了什么/JS运行时，背后发生的事情
### 3.1 过程
浏览器在读取一个网页时，代码(HTML/CSS/JS)将在一个运行环境(浏览器标签页)中得到执行。
– 注意！： 网页文档的代码需要按照其在页面上出现的顺序加载和执行。e.g. 如果JS先于要修改的HTML和CSS加载和运行，则可能发生错误。
– 每个标签页中的代码独立运行。一个标签页的代码不影响另一个。
### 3.2 JS运行次序
– 引用对象前，必须确保对象已经存在：
const para = document.querySelector(“p”);
para.addEventListener(“click”, updateName);
function updateName() {
const name = prompt(“输入一个新的名字：”);
para.textContent = `玩家 1：${name}`;
}
“`
## 3.3 编译代码(Compile) vs解释代码(Interpret)
### 1. 区别：
解释型语言
– 在解释型语言中，代码自上而下运行，且实时返回运行结果。
– 代码由浏览器执行前，不需要将其转化为其他形式。代码将直接以文本格式被接收和处理。
编译型语言
– 代码需要转化/编译成另一种形式才能运行
– 比如C/C++先被编译成机器码，然后再由计算机运行。
– 程序将以二进制（由程序的源代码产生）的格式运行
### 2. JS是什么
– JS是轻量级解释型语言。
– 浏览器接收到JS代码，并以代码自身的文本格式运行。所有的JS转换器，都运用了一种叫做即时编译(just-in-time compiling)的技术.
– JS会被编译成二进制格式。但是因为编译过程在代码运行中，而不是之前，所以JS仍然是一门解释型语言
### 3. 服务器代码 vs客户端代码（取决于代码在哪里运行）
JS既可以作为服务器端代码，也可以作为客户端代码
– 客户端代码是在用户的电脑上运行的代码。i.e. 在浏览一个网页时，网页的客户端代码会被下载，然后由浏览器来运行并展示。
– 服务器端的代码，在服务器上运行，然后运行结果，由浏览器下载并展示出来。
