JavaScript

1. 计算机基础

1.1 计算机组成

1.2 数据存储(重点)

1. 计算机内部使用二进制 0 和 1来表示数据。
2. 所有数据，包括文件、图片等最终都是以二进制数据（0 和 1）的形式存放在硬盘中的。
3. 所有程序，包括操作系统，本质都是各种数据，也以二进制数据的形式存放在硬盘中
4. 。平时我们所说的安装软件，其实就是把程序文件复制到硬盘中。
5. 硬盘、内存都是保存的二进制数据。

1.3 数据存储单位

大小关系：bit < byte < kb < GB < TB<.....

• 位(bit)： 1bit 可以保存一个 0 或者 1 （最小的存储单位）
• 字节(Byte)：1B = 8b
• 千字节(KB)：1KB = 1024B
• 兆字节(MB)：1MB = 1024KB
• 吉字节(GB): 1GB = 1024MB
• 太字节(TB): 1TB = 1024GB

1.4 程序运行（重点）

计算机运行软件的过程：
1. 打开某个程序时，先从硬盘中把程序的代码加载到内存中
2. CPU执行内存中的代码

注意：之所以要内存的一个重要原因，是因为cpu运行太快了，如果只从硬盘中读数据，会浪费cpu性能，所以，才使用存取速度更快的内存来保存运行时的数据。（内存是电，硬盘是机械）

2. 编程语言

2.1 编程

• 编程：
  • 就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码，并最终得到结果的过程。
• 计算机程序：
  • 就是计算机所执行的一系列的指令集合，而程序全部都是用我们所掌握的语言来编写的，所以人们要控制计算机一定要通过计算机语言向计算机发出命令。

2.2 计算机语言

• 计算机语言指用于人与计算机之间通讯的语言，它是人与计算机之间传递信息的媒介。

• 计算机语言的种类非常的多，总的来说可以分成机器语言，汇编语言和高级语言三大类。

• 实际上计算机最终所执行的都是 机器语言，它是由“0”和“1”组成的二进制数，二进制是计算机语言的基础。

2.3 编程语言（重点）

编程语言：
	可以通过类似于人类语言的“语言”来控制计算机，让计算机为我们做事情，这样的语言就叫做编程语言（Programming Language）。编程语言是用来控制计算机的一系列指令，它有固定的格式和词汇（不同编程语言的格式和词汇不一样），必须遵守。如今通用的编程语言有两种形式：汇编语言和高级语言。

2.4 翻译器

	高级语言所编制的程序不能直接被计算机识别，必须经过转换才能被执行，为此，我们需要一个翻译器。翻译器可以将我们所编写的源代码转换为机器语言，这也被称为二进制化。

2.5 解释型语言和编译型语言区别

计算机不能直接理解任何除机器语言以外的语言，所以必须要把程序员所写的程序语言翻译成机器语言才能执行程序。程序语言翻译成机器语言的工具，被称为翻译器。

• 翻译器翻译的方式有两种：一个是编译，另外一个是解释。两种方式之间的区别在于翻译的时间点不同
• 编译器是在代码执行之前进行编译，生成中间代码文件
• 解释器是在运行时进行及时解释，并立即执行(当编译器以解释方式运行的时候，也称之为解释器)

3. JavaScript起源

3.1 JavaScript的由来（重点）

1995年2月发布的，Netscape Navigator 2浏览器开发一种名为 LiveScript 的脚本语言。为了赶在发布日期前完成 LiveScript的开发，Netscape 与 Sun 公司建立了一个开发联盟，共同开发 LiveScript。在 NetScape
Navigator 2 发布前夕，网景为了更好地推广这个脚本语言（利用 Java语言的知名度），临时把 LiveScript 改名为 JavaScript，实际上两者没有任何关系。

3.2 浏览器战争

JavaScript 1.0 发布之后获得了巨大的成功，Netscape 随即在 Netscape Navigator 3
中又发布了JavaScript 1.1。与此同时，微软公司在推出 IE3的时候也发布了自己的脚本语言，JScript。JScript 和 JavaScript差异很大，互不兼容，编程人员不得不痛苦地为两种浏览器分别编写脚本。

3.3 制定标准（标准）

1997年，网景公司给欧洲计算机制造商协会（ECMA, European Computer Manufacturers
Association）提了一个建议，以 JavaScript 1.1 为蓝本，由该协会主导制定了一套
JavaScript 语言开发规范。于是 ECMAScript 诞生了，这是一个国际标准化的 JavaScript
开发标准，所有浏览器厂商在开发浏览器脚本语言时，都要准守这套规范。这样的话，编程人员在写代码时只要写一次，就可以在所有的浏览器上执行了。

3.4 JavaScript和HTML、CSS的区别

HTML：结构层，提供网页的结构，提供网页中的内容。

CSS: 表示层，用来美化网页。

JavaScript：行为层，可以用来控制网页内容，给网页增加动态的效果，用于跟用户的交互。

3.5 浏览器介绍

3.5.1浏览器概念简述

  浏览器（browser application）是用来访问和浏览万维网页面的客户端软件，也是现代计算机系统中应用最为广泛的软件之一，重要性也可想而知，也是我们前端工程师经常打交道的；

3.5.2浏览器的组成部分

3.5.3 浏览器内核(内壳)

JavaScript功能: 可以用来控制网页内容，给网页增加动态的效果，用于跟用户的交互。 浏览器内核（理解）

英文叫做：Rendering Engine，中文翻译很多，排版引擎、解释引擎、渲染引擎，现在流行称为浏览器内核.
浏览器内核可以分成两部分：渲染引擎(layout engineer 或者 Rendering Engine)和 JS 引擎,以及其他模块。

渲染引擎：它负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入 CSS 等），以及计算网页的显示方式，然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。
JS 引擎：则是解析 Javascript 语言，执行 javascript语言来实现网页的动态效果。

最开始渲染引擎和 JS 引擎并没有区分的很明确，后来 JS 引擎越来越独立，内核就倾向于只指渲染引擎。有一个网页标准计划小组制作了一个 ACID 来测试引擎的兼容性和性能。内核的种类很多，如加上没什么人使用的非商业的免费内核，可能会有10多种，但是常见的浏览器内核可以分这四种：Trident、Gecko、Blink、Webkit。

（1）Trident(IE内核)

国内很多的双核浏览器的其中一核便是 Trident，美其名曰 “兼容模式”。

代表： IE、360极速浏览器、百度浏览器等。

Window10 发布后，IE 将其内置浏览器命名为 Edge，Edge 最显著的特点就是新内核 EdgeHTML。

（2）Gecko(firefox)

Gecko(Firefox 内核)： Mozilla FireFox(火狐浏览器) 采用该内核，Gecko 的特点是代码完全公开，因此，其可开发程度很高，全世界的程序员都可以为其编写代码，增加功能。 可惜这几年已经没落了， 比如 打开速度慢、升级频繁。

（3） webkit(Safari)

Safari 是苹果公司开发的浏览器，所用浏览器内核的名称是大名鼎鼎的 WebKit。

现在很多人错误地把 webkit 叫做 chrome内核（即使 chrome内核已经是 blink 了）

代表浏览器： Apple Safari (Win/Mac/iPhone/iPad)、Android 默认浏览器，

（4） Chromium/Blink(chrome)

在 Chromium 项目中研发 Blink 渲染引擎（即浏览器核心），内置于 Chrome 浏览器之中。Blink 其实是 WebKit 的分支。

 大部分国产浏览器最新版都采用Blink内核。二次开发

（5） Presto(Opera)

Presto（已经废弃） 是挪威产浏览器 opera 的 “前任” 内核，为何说是 “前任”，因为最新的 opera 浏览器早已将之抛弃从而投入到了谷歌怀抱了。

*多学一招

移动端的浏览器内核主要说的是系统内置浏览器的内核。

Android手机而言，使用率最高的就是Webkit内核，大部分国产浏览器宣称的自己的内核，基本上也是属于webkit二次开发。

iOS以及WP7平台上，由于系统原因，系统大部分自带浏览器内核，一般是Safari或者IE内核Trident的

*我可以

介绍一下你对浏览器内核的理解？常见的浏览器内核有哪些？

浏览器内核包括两部分，渲染引擎和js引擎。渲染引擎负责读取网页内容，整理讯息，计算网页的显示方式并显示页面，js引擎是解析执行js获取网页的动态效果。 后来 JS 引擎越来越独立，内核就倾向于只指渲染引擎。
IE：Trident
firefox：Gecko
chrome、safari：webkit
chrome：blink
Opera：Presto、blink
Microsoft Edge：EdgeHTML

4. JavaScript做什么的

JavaScript的用途已经不仅局限于浏览器了，Node.js的出现使得开发人员能够在服务器端编写JavaScript代码，使得JavaScript的应用更加广泛。

5. Javascript的特点（重点）

• Javascript是一个脚本语言，可跨平台，支持面向对象。
• 脚本（Script）简单地说就是一条条的文本命令，按照程序流程执行。
  常见的脚本语言：JavaScript、VBScript、Perl、PHP、Python等。
  非脚本语言：C、C++、Java、C#等。
• 脚本语言与非脚本语言的区别：
  非脚本语言一般需要编译、链接，生成独立的可执行文件后才能运行。
  脚本语言依赖于解释器，只在被调用时自动进行解释或编译。
• 几乎所有的浏览器，包括手机等各类移动设备。
  特点：JavaScript语言不依赖操作系统，仅需要浏览器的支持。

5.1 Javascript的组成（重点）

5.2 ECMAScript - JavaScript的核心

ECMA 欧洲计算机制造联合会

网景：JavaScript

微软：JScript

定义了JavaScript的语法规范

JavaScript的核心，描述了语言的基本语法和数据类型，ECMAScript是一套标准，定义了一种语言的标准与具体实现无关

5.3 DOM(Document Object Model) - 文档对象模型

一套操作页面元素的API(API（Application Programming Interface，应用程序接口）)

DOM可以把HTML看做是文档树，通过DOM提供的API可以对树上的节点进行操作。

5.4 BOM(Browser ObjectModel) - 浏览器对象模型

一套操作浏览器功能的API（接口-类库-方法）,通过BOM可以操作浏览器窗口，比如：弹出框、控制浏览器跳转、获取分辨率等。

6. 服务端-客户端理解

• 服务端是为客户端服务的，服务的内容诸如向客户端提供资源，保存客户端数据。是实现游戏特色化的重要途径，也是最直接可以通过游戏表现出来的技术，比如你要修改某个NPC的参数，重加载后，在游戏内立刻体现出来。
• 客户端（Client）或称为用户端，是指与服务器相对应，为客户提供本地服务的程序。除了一些只在本地运行的应用程序之外，一般安装在普通的客户机上，需要与服务端互相配合运行。因特网发展以后，较常用的用户端包括了如万维网使用的网页浏览器，收寄电子邮件时的电子邮件客户端，以及即时通讯的客户端软件等。对于这一类应用程序，需要网络中有相应的服务器和服务程序来提供相应的服务，如数据库服务，电子邮件服务等等，这样在客户机和服务器端，需要建立特定的通信连接，来保证应用程序的正常运行。

7. 使用JavaScript（重点）

7.1 行内代码

• 使用 javascript: 前缀构建执行 JavaScript 代码的 URL。

  点我
  
  

所有可以设置 URL 的地方都可以使用这种以 javascript: 作为前缀的 URL，当用户触发该
URL 时，javascript: 之后的 JS 代码就会获得执行。

• 将 JS 代码写到元素的事件属性值中

这两种方式只适用于代码量比较少的时候，如果代码比较多，建议使用内部代码或写到单独的
JS 文件中。

7.2 内部代码（内嵌式）

如果页面需要中包含大量的 JavaScript 代码，则建议将这些JavaScript脚本放在
<script> 标签中。<script> 元素即可作为 的子元素，也可作为
的子元素，通常位于元素闭合标签的前面。

<script type="text/javascript">
	alert('Hello JavaScript')
</script>

7.3 外部代码（外链式）

为了让 HTML 页面和 JavaScript 脚本更好地分离，我们可以将 JavaScript脚本单独保存在一个 .js 文件中，HTML 页面导入该 .js 文件即可。

<script src="test.js" type="text/javascript"></script>

注意：

• 由于现代网页开发提倡结构、样式、行为的分离，即分离HTML、CSS、JavaScript三部分的代码，避免直接写在HTML标签的属性中，从而更有利于维护。因此在实际开发中不推荐使用行内式。
• 存在的问题：引入JavaScript代码时，页面的下载和渲染都会暂停，等待脚本执行完成后才会继续（内嵌式或外链式）。
  解决的办法：对于不需要提前执行的代码，将