1.JavaScript历史
要了解JavaScript，我们首先要回顾一下JavaScript的诞生。在上个世纪的1995年，当时的网景公司正凭借其Navigator浏览器成为Web时代开启时最著名的第一代互联网公司。由于网景公司希望能在静态HTML页面上添加一些动态效果，于是叫Brendan Eich这哥们在两周之内设计出了JavaScript语言。你没看错，这哥们只用了10天时间。为什么起名叫JavaScript？原因是当时Java语言非常红火，所以网景公司希望借Java的名气来推广，但事实上JavaScript除了语法上有点像Java，其他部分基本上没啥关系。
2.ECMAScript
因为网景开发了JavaScript，一年后微软又模仿JavaScript开发了JScript，为了让JavaScript成为全球标准，几个公司联合ECMA（European Computer Manufacturers Association）组织定制了JavaScript语言的标准，被称为ECMAScript标准。所以简单说来就是，ECMAScript是一种语言标准，而JavaScript是网景公司对ECMAScript标准的一种实现。那为什么不直接把JavaScript定为标准呢？因为JavaScript是网景的注册商标。不过大多数时候，我们还是用JavaScript这个词。如果你遇到ECMAScript这个词，简单把它替换为JavaScript就行了。
3.JavaScript版本
JavaScript语言是在10天时间内设计出来的，虽然语言的设计者水平非常NB，但谁也架不住“时间紧，任务重”，所以，JavaScript有很多设计缺陷，我们后面会慢慢讲到。此外，由于JavaScript的标准——ECMAScript在不断发展，最新版ECMAScript 6标准（简称ES6）已经在2015年6月正式发布了，所以，讲到JavaScript的版本，实际上就是说它实现了ECMAScript标准的哪个版本。由于浏览器在发布时就确定了JavaScript的版本，加上很多用户还在使用IE6这种古老的浏览器，这就导致你在写JavaScript的时候，要照顾一下老用户，不能一上来就用最新的ES6标准写，否则，老用户的浏览器是无法运行新版本的JavaScript代码的。不过，JavaScript的核心语法并没有多大变化。我们的教程会先讲JavaScript最核心的用法，然后，针对ES6讲解新增特性。
4.JavaScript基本语法
(1)语法：
JavaScript的语法和Java语言类似，每个语句以;结束，语句块用{...}。但是，JavaScript并不强制要求在每个语句的结尾加;，浏览器中负责执行JavaScript代码的引擎会自动在每个语句的结尾补上;。
注意：让JavaScript引擎自动加分号在某些情况下会改变程序的语义，导致运行结果与期望不一致。在本教程中，我们不会省略;，所有语句都会添加;。
例如，下面的一行代码就是一个完整的赋值语句：
var x = 1;下面的一行代码是一个字符串，但仍然可以视为一个完整的
'Hello, world';下面一行代码代码包含两个语句，每个语句用;表示语句：
var x = 1; var y = 2; // 不建议一行写多个语句!语句块是一组语句的集合，例如下面的代码先做了一个判断，如果判断成立，将执行{...}中的所有语句：
if (2 > 1) {
x = 1;
y = 2;
z = 3;
}注意花括号{...}内的语句具有缩进，通常是4个空格。缩进不是JavaScript语法要求必须的，但缩进有助于我们理解代码的层次，所以编写代码时要遵守缩进规则。很多文本编辑器具有“自动缩进”的功能，可以帮助整理代码。
{...}还可以嵌套，形成层级结构：
if (2 > 1) {
x = 1;
y = 2;
z = 3;
if (x < y) {
z = 4;
}
if (x > y) {
z = 5;
}
}JavaScript本身对嵌套的层级没有限制，但是过多的嵌套无疑会大大增加看懂代码的难度。遇到这种情况，需要把部分代码抽出来，作为函数来调用，这样可以减少代码的复杂度。
(2)注释:
以//开头直到行末的字符被视为行注释，注释是给开发人员看到，JavaScript引擎会自动忽略：
// 这是一行注释
alert('hello'); // 这也是注释另一种块注释是用/*...*/把多行字符包裹起来，把一大“块”视为一个注释：
/* 从这里开始是块注释
仍然是注释
仍然是注释
注释结束 */5.Javascript标识符和命名规约
(1)标识符
所谓标识符是指变量、函数、属性的名字，或者函数的参数。
标识符的书写有几个特征：
1. .区分大小写。
2. 第一个字符必须是字母、下划线_、或者是$。
3. 后面的可以是字母、数字、下划线_、$。
4. 标识符可以使用中文，但是一般不推荐这么做。
使用是实际意义的单词。
变量使用驼峰规则，第一个单词首字母小写，后面单词首字母大写。
变量使用名词，方法函数使用动词开头，常量全部用大写字母，函数创建对象首字母大写。
(2)命名规约
使用是实际意义的单词。变量使用驼峰规则，第一个单词首字母小写，后面单词首字母大写。变量使用名词，方法函数使用动词开头，常量全部用大写字母，函数创建对象首字母大写。如下：
var firstName;
var isSmall;
var hasClass;
var PI;
var MAX_COUNT;
function getName(){}
function Person(){}6.弱类型
在一些编译语言（C、Java、C#）等变量的类型是固定的，在声明变量的时候就要标识其类型，在程序执行前编译阶段变量的类型就确定了，而且不能改变，我们称之为强类型。
int a = 2;
string b = "hello";一些常见的解释型语言（PHP、JavaScript）等变量的类型是松散的，一个变量可以用来保存任何类型的数据，变量的类型不是由声明时决定（声明的时候只是用了var运算符），而是在程序执行阶段由其值的类型决定，随着程序运行其值类型改变，变量类型也会发生改变。
var message = 1; //message 类型就是数字
message = "hello world!"; //message 类型变为字符串7.变量提升
JavaScript引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。这造成的结果，就是所有的变量的声明语句，都会被提升到代码的头部，这就叫做变量提升。
我们写了一个赋值语句。
var a = 2;实际上执行过程是解释器在未执行的时候先解析出变量声明，然后给他初始值undefined，然后才逐句执行程序。
var a;
a = 2;8.关键字和保留字
关键字是JavaScript引擎会用到的一些字，我们标识符不能再使用，比如定义变量的关键字var，关键字有：
break、else、new、var、case、finally、return、void、catch、for、switch、while、continue、function、this、with、default、if、throw、delete、in、try、do、instanceof、typeof除了这些不能用作标识符的关键字，js还规定了一些不能用作标识符的保留字，这些字符没有什么意义，但是未来会用到：
abstract、enum、int、short、boolean、export、interface、static、bye、extends、long、super、char、final、native、synchronized、
class、float、package、throws、const、goto、private、transient、
debugger、implements、protected、volatile、doubler、import、public实际上一些保留字在新的ECMAscript已经得到使用。
9.浏览器的渲染机制
(1)网页的组成：
网页 = Html+CSS+JavaScript
Html: 网页元素内容
CSS: 控制网页样式
JavaScript：操作网页内容，实现功能或者效果
(2)与JS有关的
- javascript和java没有任何关系。
- 是客户端脚本语言。
- ECMAScript, DOM, BOM, NodeJS。
- JS的引入方式：
<html>
<head>
<meta charset="utf-8">
<title>标题</title>
<link href="index.css" rel="stylesheet">
<style>
body{
background: red;
}
</style>
</head>
<body>
<p>
</p>
<script src="index.js"></script>
<script>
alert(1);
</script>
</body>
</html>(3)浏览器的渲染顺序
- 解析 HTML 标签, 构建 DOM 树。
- 解析 CSS 标签, 构建 CSSOM 树。
- 把 DOM 和 CSSOM 组合成 渲染树 (render tree)。
- 在渲染树的基础上进行布局, 计算每个节点的几何结构。
- 把每个节点绘制到屏幕上 (painting)。
参考：How browsers work
扫一扫
1337
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
