JavaScript的基本概念和组成

一个前端网页主要由三门语言组成，他们之间是缺一不可的关系

HTML：确定网页的结构

CSS: 确定网页的样式

JavaScript: 确定网页的行为(交互)

在前端开发中一个网页的源代码主要由三部分组成（HTML,CSS,Javascript）,其中HTML确定网页的结构，CSS确定网页的样式,而JavaScript则主要负责网页的行为（动态效果，交互事件等）。

总结：因为前端网页由三部分组成,HTML、CSS、JavaScript

JavaScript作用

JavaScript作用:确定网页的行为交互

大白话： 教网页做事请。

JavaScript三个组成部分

ECMAScript - JavaScript的核心

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

DOM - 文档对象模型

一套操作页面元素的API
DOM可以把HTML看做是文档树，通过DOM提供的API可以对树上的节点进行操作

BOM - 浏览器对象模型

一套操作浏览器功能的API
通过BOM可以操作浏览器窗口，比如：弹出框、控制浏览器跳转、获取分辨率等

js三种书写位置

JavaScript也有三种书写方式，并且与CSS的三种书写方式几乎一致

1.行内样式：不推荐，因为不便于维护

<button οnclick="window.alert('js行内写法')">欢迎来到中国</button>

2.内部样式：写在script标签中,如果界面js代码较少可以使用，复杂的话不推荐

<script >alert("这是JS内联样式")</script >

3.外部样式：写在js文件中，使用script的src属性导入

<script src="./01-JS外联写法.js"></script>

复习CSS代码的三种写法

1.行内样式：不推荐，因为不便于维护

<h1 style="background: bisque">哈哈哈</h1>

2.内部样式：写在style标签中,如果界面css样式比较简单可以使用，复杂的话不推荐

<style>.div{background: hotpink;}</style>

3.外部样式：写在css文件中，使用link导入

<link rel="stylesheet" href="./01-css外联样式.css">

css外联样式的本质其实就是字符串替换 将下方这行代码替换成对应文件的所有代码

细节注意点

1.无论是CSS还是JS的三种写法，当一个html文件存在多种写法时要记住HTML的代码是从上往下解析的
2.如果script标签没有src属性则表示内联样式，如果有src属性则表示外联样式，外联样式JS代码只能写在 js文件中而不能写在script标签中

js两种注释写法

代码注释的作用：

1.理清思路，方便自己以后阅读代码
2.规范编程，方便以后别人接手代码便于维护

JS注释有两种写法

// 注释内容:单行注释：注释内容只能是一行，适用于注释内容较少

vscode快捷键 CTRL + /

/* 注释内容 */:多行注释：注释内容可以是多行，适用于注释内容较多，比如一行写不下

vscode快捷键 CTRL + /

输入与输出语句

输出语句1 : 在网页弹出一个提示框，输出数据

//输出语句1:弹出一个提示框，通常用于提示用户，也可以用于调试
alert("hello world");

输出语句2：在控制台打印某个数据

//输出语句2:打印某个数据的值，查看数据是否成功
//这个写法不是给用户看的，而是给程序员自己调试看的
console.log("欢迎大家来到中国");

输出语句3：将数据显示到网页

//输出语句3:将数据显示到网页，相当于给body添加内容
document.write("中国最强");

输入语句1：在网页弹出一个输入框，让用户输入数据

//输入语句1：弹出一个输入框，可以用来输入数据
prompt("中国无敌");

输入语句2：在网页弹出一个确认框，让用户输入 确认/取消 二选一

//输入语句2：在网页弹出一个确认框，让用户输入 确认/取消 二选一
confirm("你确定你已经成年了吗？");

js代码执行原理介绍

1.软件

应用软件：浏览器(chrome/ie/firefox)、QQ、Sublime、Word、webstorm
系统软件：windows，Linux，unix，OSX，iOS，android

2.硬件

三大件：CPU,内存,硬盘
输入设备：鼠标,键盘,摄像头等
输出设备：显示器,打印机,投影仪等

代码运行的原理

计算机将存储在硬盘中的html文件读取到内存中
浏览器内核编译器开始编译代码（cpu只能处理二进制数据，需要将我们写的代码转成二进制）
CPU处理与计算
CPU将我们代码在运行时产生的数据保存到内存中