【全栈之前端练习】ES6核心编程

基于浏览器程序设计的JavaScript + ES6新特性

基础知识1

计算机语言

1、HTML是编程语言吗？
不是，没有程序控制的体系，没有逻辑，属于标记语言。
2、HTML5是编程语言吗？
是，HTML5是由HTML5规范+css3规范+JavaScript组成。
3、语言发展？
4GL（SQL）
中高级语言（c、java）
汇编语言（助记符）
机器语言（二进制）

4、编译执行，一次编译多次执行，效率高。C
5、解释执行，解释器读一行，解释一行 ，执行一行，灵活，各种脚本语言。JavaScript
6、编译中间字节码 由虚拟机执行字节码。Java

JavaScript

Javascript简介

典型的解释执行的脚本语言，需要解释器才能运行，常见的解释器有google（cchrom）的v8引擎，Mozilla（火狐）的奥丁猴引擎

是一种基于对象的脚本语言
解释执行
代码以纯文本形式存储
类型宽松
Netscape公司和sun公司联手完成

Javascript功能

JavaScript的主要作用
1、客户点脚本语言的主要应用者，客户端编程的默认语言
2、服务器编程 node.js

JavaScript组成

JavaScript=ECMAScript+DOM+BOM

ECMAScript

与JavaScript的关系: 最早 javascript提出，应用之后才进行了标准化，交由ECMA组织标准化为ECMAScript。仅包括语言核心（建对象怎么建，数组怎么用），由不同的环境实现不同的应用业务，

BOM（浏览器对象模型）
访问和操作浏览器窗口，每种浏览器都有自己的BOM

DOM（文档对象模型）
通过创建树来表示文档

JavaScript的基本使用

JavaScript是解释执行的，所以是阻塞式 加载模式（排队/前置语句错误/后置语句不会执行）----前面错了后面不执行
1、内嵌式：使用html的事件属性，引入简单的JavaScript代码，大部分事件属性用on开头

<button onclick="alert('试试就试试');">点击我试试</button>

onclick
onload
onunload
alert
2、 script标签内联式，页面中将JavaScript代码放在里，不可以多页面共享代码

<!--因为JavaScript一统客户端编程， 所以script标签无需指定type属性，默认就是javascript-->
<script>
    alert('快到   /body标记了');
   //onload发生在文档对象准备完毕进行渲染之前
</script>

3、外联式【推荐】通过script 标签的src属性引用外部独立的js文件

创建文件 main.js

console.log（'在控制台输出信息'）

<!--外联方式引入独立的js代码-->
<script src="./main.js">
    alert("看是否能弹出");
    //不能，如果有src属性，则标签内所有代码均不被执行
</script>

小练习

通过引入独立的js文件，在控制台输出也一段消息

思路：新建js，console。log语句

与3.类似

基础知识2

引入

推荐外联的方式本质上和css的外联方式相同，避免代码之间出现 耦合（关联性）

解耦合

降低各个模块之间的复杂关系， 通过简单接口实现互相调用

HTML：负责元素架构组织
人【脑袋，脖子粗，身体壮，2条腿】

CSS： 外观修饰
化妆【描眉，扑粉，抹口红】

Javascript： 行为控制
修养【温文尔雅，不吃饭的时候扣脚丫】

建议： 能用HTML解决的就不要用css，css能解决的不要用JavaScript，符合循序渐进原则，当高层不能使用的时候，底层可以提供最基本的功能。

65