这是我参与「第五届青训营 」伴学笔记创作活动的第 3 天。

前端与JavaScript基础知识

一、JavaScript的组成

1. ECMAScript：JavaScript的核心，描述了语言的基本语法和数据类型

2. 文档对象模型（DOM）：DOM是HTML和XML的应用程序接口。DOM将把整个页面规划成由节点层级构成的文档。HTML和XML页面的每个部分都是一个节点的衍生物。

   DOM通过创建树来表示文档，从而使开发者对文档的内容和结构具有空间的控制力。利用DOM API 可以轻松地删除、添加和替换节点（getElementById、childNodes、appendChild、innerHTML）

3. 浏览器对象模型（BOM）

   对浏览器窗口进行访问和操作，比如弹出新的浏览器窗口，移动、改变和关闭浏览器窗口，提供详细的网络浏览器信息、详细的页面信息、详细的用户屏幕分辨率的信息，对cookies的支持等。

JavaScript基本结构：

<script language="javascript" type="text/javascript">
	内容
</script>

二、数据类型和变量

1. 声明变量：var

2. number

   infinity：无穷大
   -infinity：负无穷大
   NaN：不是数字
   

3. string

   可用单引号也可以用双引号

   可以用indexOf()查询字符串所在位置

4. boolean

   它的值有两种：true or false

5. 比较运算符

   == ：表示等于
   === ：表示全等
   它们都可以用来表示两个值是否相等 区别在于 三个等号可以区分值的数据类型是否相等
   其他  >  <  >=  <=  != 用法相同
   

6. 数组

   • 可以直接使用"[]"来创建数组。例如：

     var ages = [10,12,13];
     

   • 使用构造函数来创建数组K

     var colors = new Array();
     var colors = new Array(6);
     var colors = new Array("red","blue");
     
     /* 使用array.length 可获取数组长度  */
     

7. 对象

   对象是带有属性的方法的特殊数据类型，JavaScript中提供了多个内置对象，比如string、date、array等。

   通过这些对象的属性可以很方便地操作字符串、日期和数组。

   例如通过string对象的trim()方法移除字符串首位空白，或者通过toUpperCase()方法将字符串中所有的字符转换为大写。

条件判断

1. if语句
2. if…else语句
3. if…else if … else 语句
4. switch语句

循环语句

1. for循环（循环里的变量记得变成 var i = 0;)

2. for … in 循环

   主要是对数组和对象的属性进行遍历。例如：

   var ages = [1,2,3];
   for(var i in ages) {
   	document.write(address[i] + "-");
   }
   
   /* 输出：1-2-3 */
   

3. while循环

4. do…while循环

函数定义和调用

1. 定义函数

   function functionName（parameters) {

   ​ 执行的代码

   }

   例如：

   <script>
       function sum(num1, num2) {
          return num1 + num2;
       }
   
       var x = sum(1,2);
       console.log(x);
   </script>
   

2. 引用代码