JavaScript

JavaScript介绍:

JavaScript 是一种客户端脚本语言。运行在客户端浏览器中，每一个浏览器都具备解析 JavaScript 的引擎。

脚本语言：不需要编译，就可以被浏览器直接解析执行了。

核心功能就是增强用户和 HTML 页面的交互过程，让页面有一些动态效果。以此来增强用户的体验！

我们举个例子，我们提供了一个表格，上面还有一个输入的表单项，比如说我们在表单项里输入了相关的信息，我们点击添加的按钮，就会把我们刚才在表单项里的信息添加到我们的表格当中，我们还可以点击表格中的删除按钮，那么该数据就会从我们的表格中删除掉，所以我们表格中的数据是不是随着我们数据的变化而变化啊，所以说叫他动态的表格，那么像这样一个动态的效果，我们就可以通过JS来实现

我们的JS除了遵循ECMAScript标准之外，我们的JS还有一些它特有的内容，就是BOM以及DOM

快速入门：

我们创建一个普通的按钮，  

 我们点击这个按钮没有任何的效果，那么我们希望我们点击这个按钮，它会给我们一个提示的框框，那这样的话是不是也是一个对应的动态效果啊，那么这个功能就可以通过我们的JS来实现，

这个就是我们给我们的按钮标签加了一个id属性，然后我们在script标签中获取了这个按钮的标签，我们的onclick给这个按钮添加了一个单击的事件，也就是说我们一单击这个按钮，它会给我们实现哪些功能，这个function里面就代表它要实现的功能了，

 

我们单击之后，弹出一个框框，这就是一个动态效果，

引入js的方式一：内部方式

就是说我们把这个JS的相关代码是不是直接编写在我们的HTML页面当中啊，这就是内部方式引入JS

除此之外，我们还可以把这个JS的相关代码做一个抽取，抽取到一个外部的配置文件里边，然后我们在HTML文件里面，再把这个内容给他引入进来

引入js的方式二：外部方式

对于注意一解释：因为即使你写了其他的JS代码，这里也不可能运行，它只会运行外部JS文件里的JS代码

对于注意二解释：因为这样可能会导致，script标签之间相互套用，导致出现问题

Src代表，指定外部JS文件

注意：js文件写的就是js代码，不用再写script标签

我们对比一下这两种JS的引入方式：内部方式：是不是就仅局限于我们当前这个页面可以使用JS啊，而外部方式，只要我们把这个文件引入进来，那么是不是我们在所有的页面中都可以进行使用啊，所以外部方式更加灵活一些  

开发环境搭建

• Node.js:JavaScript 运行环境

• VSCode：编写前端技术的开发工具

我们说下这个VScode工具的使用，如果使用idea进行前端的开发，我们做了修改之后，我们的浏览器显示并不会实时的去帮你刷新，必须手动刷新浏览器页面它才会给你更新，而VScode它就会实时的给你进行显示，但是VSCode它并不会像idea一样给你去保存代码，所以我们编写的时候，要注意我们的Ctrl+s进行随时保存

 我们保存的时候，要注意文件格式的选择，我们不能是txt格式的，我们要选择HTML文件形式，

 

 

对于我们的VScode前端开发工具，里面并没有我们的HTML的基本组成部分，可以看到是空的，即创建文件的时候，是不会为我们自动提供的，  

我们需要在代码区域输入一个英文的！，然后敲回车 ，这样我们的基本格式就出来了  

代码编写完，我们怎么通过浏览器访问我们制作的页面呢？我们鼠标右键，选择倒数第二项就可以了  

另外注意：我们这个工具最大的优点就是我们在修改了代码之后，我们并不需要重新打开这个浏览器，或者去刷新，因为他是实时的为我们显示修改后的内容，前提是你得CtrlS保存你的代码

JavaScript基本语法

注释

• 单行注释

  // 注释的内容

• 多行注释

  /*
  注释的内容
  */

输入输出语句：

在JS当中常见的输入输出语句有以下几种：

 

 

那么什么叫控制台输出啊，就是在我们这个浏览器的控制台上来进行显示的，

注意：我们的页面内容输出，是在一行上进行显示的，  

可以看到是不是没有一个换行的效果啊  

那么怎么样才能让他实现一个换行的效果呢?  

即我们的页面内容输出语句，还可以去写我们HTML中的相关的标签  

变量和常量：

JavaScript 属于弱类型的语言，定义变量时不区分具体的数据类型，只有你给它赋值了，它才有数据类型了，即这个值是有数据类型的。  

可以看到是不是没有任何的显示，那有人说不对啊，即使你这个l1显示不出来，那这个l2肯定会显示出来啊，要注意，这个l1是一个局部变量，它出了这个大括号就用不了了，用不了我们还强行进行使用，那么它就会报错  

这个错误，我们是在开发者工具中才能查看的到的，  

原始数据类型和typeof方法

之前在学习定义变量的时候，我们说过由于JS是一种弱类型的语言，在定义变量的时候不需要区分具体的数据类型，但是呢，我们是在定义的时候不需要区分，但是它还是有具体的数据类型的，那下面我们就看下在JS当中有哪些原始的数据类型。

 注意：undefined就代表，定义好变量之后，没给他去赋值

运算符

• 算数运算符

赋值运算符  

比较运算符  

逻辑运算符  

<