3.01-初识 JavaScript

1. 初识 JavaScript

1.1 JS历史

布兰登艾奇（Brendan Eich，1961年 ~）是一名网景公司的员工，于1995年利用10天完成JS设计。起初命名为LiveScript，后来网景公司和Sun公司合作后改名为JavaScript

1.2 JS是什么

• JS是世界上最流行的语言之一，是一种运行在客户端的脚本语言
• 脚本语言：不需要编译，运行过程中由JS解释器解释并执行
• 现在也可以基于Node.js进行服务端编程

1.3 JS的作用

• 表单动态核验（JS产生最初的目的）
• 网页特效
• 服务端开发（Node.js）
• 桌面程序（Electron）
• App（Cordova）
• 控制硬件-物联网（Ruff）
• 游戏开发（cocosd-js）

1.4 浏览器执行JS简介

浏览器分为两部分，渲染引擎和JS引擎

• 渲染引擎：用于解释HTML和CSS，俗称内核，比如Chrome浏览器的blink，老版本的webkit
• JS引擎：也称为JS解释器，用于读取页面中的JS代码，对其处理后运行。比如Chrome浏览器的V8

浏览器本身并不会执行JS代码，而是通过内置的JS引擎（JS解释器）来执行JS代码。JS引擎执行代码时会逐行读取每一句源码，转换为机器语言然后由计算机去执行。所以JS被归为脚本语言，因为是逐行读取代码。

1.5 JS的组成

• ECMAScript：JavaScript语法
• DOM：页面文档对象模型
• BOM：浏览器对象模型

1.5.1 ECMAScript

ECMAScript是由ECMA国际（原欧洲计算机制造协会）设定的标准化的一门编程语言，这种语言在万维网上应用广泛，它往往被称为JavaScript（网景公司）或JScript（微软公司）。但后两者其实只是ECMAScript语言的实现和扩展。

ECMAScript规定了JS的变成语法和基础核心知识，是所有浏览器厂商共同遵守的一套JS语法工业标准

1.5.2 DOM

文档对象模型（Document Object Model）是由W3C组织推荐的处理可扩展标记语言的标准编程接口

通过操作文档对象模型可以对页面的所有元素进行操作（大小、颜色等等）

1.5.3 BOM

浏览器对象模型（Browser Object Model）提供了独立与内容的，可以与浏览器窗口进行交互的对象结果。通过BOM可以操作浏览器窗口，比如弹出框、控制浏览器跳转、获取分辨率等等

1.6 JS初体验

JS有三种书写位置，分别是行内、内嵌和外部。

1.6.1 行内JS

<input type="button" value="按钮" onclick="alert('行内JS')" />

• 可以把单行或少量JS代码卸载HTML标签的事件属性后，如：onclick（鼠标单击事件）
• 注意单双引号的引用
• 可读性差，在HTML中编写大量JS代码，不方便阅读
• 引号易错，引号多层嵌套匹配时，容易弄混
• 特殊情况下使用

1.6.2 内嵌JS

<script>
    alert("内嵌式JS");
</script>

• 可以将多行JS代码写到<script>标签中

1.6.3 外部JS

<script src="my.js"></script>

• 将所有的JS代码独立于页面之外，方便阅读及复用
• 引入外部JS文件的<script></script>直接不要写代码
• 适用于JS代码量较多的情况

1.7. JavaScript 注释

• 单行注释：//
• 多行注释：/* JS Code */

1.8. JavaScript 输入输出语句

为了方便信息的输入和输出，JS提供一些输入输出语句

方法	说明	归属
alert(msg)	浏览器弹出警示框	浏览器
console.log(msg)	浏览器控制台打印输出信息	浏览器
prompt(info)	浏览器弹出输入框，用户可以输入	浏览器