JavaScript简介
JavaScript如今已成为最受欢迎的编程语言之一，不管是电脑、手机、还是平板上运行的所有网页，背后的交互逻辑都是由JavaScript驱动的。而且自从2009年NodeJS诞生后，我们也能使用JavaScript编辑后端逻辑了，从此JavaScript便成为了全栈工程师必不可少的技能。
简单来说，JavaScript是一种运行在游览器中的解释型编程语言，在Web世界里，JavaScript是唯一的选择，只有它能跨平台、跨游览器驱动网页，与用户交互。也因为NodeJS的诞生，如今JavaScript也成为了全栈开发的必备技能。
JavaScript历史简介
了解过Java的朋友肯定很好奇JavaScript和Java的关系，以及现在经常提到的ECMAScript(ES)和JavaScript的关系，那我们接下来就简单了解下JavaScript的历史。
在1995年，网景公司凭借Navigator游览器成为Web时代最著名的第一代互联网公司。由于网景公司希望在静态HTML网页上添加一些动态效果，于是叫Brendan Eich设计出相关语言，这大神仅仅用了10天便设计出了JavaScript。
为什么取名叫JavaScript呢？其实JavaScript最早名叫Mocha，后面改名为LiveScript，最后才改为 JavaScript。当时网景公司和Sun公司（创建Java的公司）有过一段合作经历，为了借助Java的名气来推广JavaScript，才因此得名。
网景公司为了让JavaScript成为全球标准，联合ECMA（欧洲电脑制造商）组织制定了JavaScript语言标准，称之为ECMAScript标准，所以现在大家常常听到的ECMAScript 2018、ECMAScript 2019、等等便是每年不同的标准，虽然标准每年都会更新，给语言添加一些新的特性，但在此教程中学习到的基础语法是基本不变的。
HTML, CSS和JavaScript简介
了解完JavaScript在网页开发中的重要性和历史，我们接下来聊聊网页开发必备三大件HTML, CSS和JavaScript各自在网页中的作用。
在之后的教程中，我们虽然会经常提及HTML和CSS，但是这丝毫不影响我们学习JavaScript。HTML和CSS不是编程语言，非常易学，大家可以在学习完JavaScript后，再学习HTML和CSS也不迟。接下来我来简单介绍一下三门语言的功能，大家能理解就行。
HTML
每个网页都是由HTML组成的，大家如果使用Chrome打开任何一个网页，点击右键选择View Page Source就能看到网页的源代码了，大家会看到类似以下的内容：
<!DOCTYPE html>
<html>
</head>
...
</head>
<body>
...
</body>
</html>其中第一行<!DOCTYPE html>指明此文件是HTML文件，然后网页内容就被包在<html>…</html>中，简单来说，HTML是网页的骨架，所有显示的文字和内容都是通过HTMl中的各种标签（tag: <head>…</head>, <body>…</body>）进行排列的。
大家可以在本地编辑一个涵盖以下内容的hello.html文件：
<!DOCTYPE html>
<html>
<head></head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>使用游览器打开此文件，就能显示出以下的界面：
其中<h1>…</h1>标签指定了This is a Heading为标题，而<p>…</p>则定义了一个段落，所以标题This is a Heading会更大。
CSS
光光使用HTML制作网站，这个网站不会很好看，显得非常骨感，为了让网站有血有肉，我们可以使用CSS来添加额外的装饰。以下我们在html中的<head></head>使用<style>…</style>标签加入css的定义：
<!DOCTYPE html>
<html>
<head>
<style>
h1 { color: red; }
p { background-color: yellow; font-size: 50px;}
</style>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>使用游览器打开后，网页就会变成以下这样：
css代码很好理解：h1 { color: red; } 代表将标题This is Heading变为红色，p { background-color: yellow; font-size: 50px; } 将This is a paragraph的背景颜色和字体大小改变了。
简单来说，CSS可以改变网页中的颜色，字体，位置，给网页穿上衣服，使视觉效果丰富起来，变得更漂亮了。
JavaScript
光有HTML和CSS，我们的网页被设计成什么样，就是什么样，不会有任何改变。而JavaScript则能操作HTML和CSS，改变网页的内容和排版，使网页变得动态起来。
比如将HTML文件更新为以下的内容：
<!DOCTYPE html>
<html>
<head>
<script>
function showTime() {
var d = new Date();
document.querySelector("p").innerHTML = `${d.getHours()}:${d.getMinutes()}:${d.getSeconds()}`;
}
</script>
<style>
h1 { color: red; }
p { background-color: yellow; font-size: 20px;}
</style>
</head>
<body>
<h1 onclick="showTime()">This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>可以看到我们在<head></head>中加了一个<script></script>标签，其中定义了一个函数showTime，这个函数的作用就是将 p（段落）中的html换成当前的时间，然后我们又在<h1>中加入了一个onclick=”showTime()”，代表我们只要一点击This is a Heading，p中的内容就会变为当前的时间。大家打开更新后的html文件，点击This is a Heading，网页就会变成这样：
如果你再次点击This is a Heading，段落中的内容又会更新为最新的时间。很明显，通过JavaScript操作HTML和CSS，网站的交互性会更强，网页也变得动态起来了。总而言之，HTML是网页的骨架，CSS是衣服，JavaScript则为网页注入了灵魂和意识。
《JavaScript全栈入门教程》大纲
《JavaScript全栈入门教程》还是一样遵循我做入门视频的20/80原则，意味着用百分之20的时间掌握百分之80的重点内容，但和以往编程语言教学不同的是，这个系列不仅仅只教大家JavaScript的语法，其中还会涵盖网页开发的重要概念和技术，在此系列的最后，我还会教大家使用JavaScript的后端语言NodeJS，开发一个结合了全栈技术的网络爬虫项目。
内容涵盖内容如下：
- 数据类型, 运算符
- 条件判断和循环
- 函数，面对对象
- NodeJS
- JSON, AJAX, Restful API
- 全栈爬虫项目
希望在完成这个系列的学习后，大家不仅仅能掌握JavaScript这门语言，还能对网站开发有深入的了解，具备基本的全栈开发能力。