js基础部分总结

js基础部分总结

1 - JavaScript注释

1.1 单行注释

单行注释的注释方法如下：

// 双斜杠发，快捷键是选中想注释的代码按（ctrl + /）

1.2 多行注释

多行注释的方法如下：

/*
这是我不想
要的内容
*/

/* */ 多行文本注释的快捷键是 （alt + shift + a）

2 - JavaScript输入输出语句

方法	说明	归属
alert(想输出的值)	浏览器弹出警示框	浏览器
console.log(想输出的值)	控制台打印输出的结果	浏览器
prompt(想输出的值)	浏览器弹出输入框，用户输入	浏览器

3 - 变量

1. 变量的定义

1.1 变量的定义的语法结构

​ 语法结构：var 变量名 = 变量值;

​ Javascript的变量是弱类型

​ 定义变量时，没有初始化值 就会不清楚该变量的值的类型

​ 只有在为变量初始化值 才会知道该变量的值的类型

1.2 定义变量的几种方式

1.2.1 定义变量并初始化值

//  1.定义变量，并初始化值
        var v = '我是变量';/*定义变量 - 变量的定义，并且初始化值*/
        console.log=(v); /*调用变量*/

1.2.2 定义变量但不初始化值

/ 2.定义变量但是没有初始化值
        var v;/*只定义，没有初始化*/
        console.log(v);/* 结果为undefined(未定义)*/
v1 = "我是变量";/*初始化值（赋值）*/
        console.log(v1);

1.2.3 多变量赋值

 /* 3.多变量同时定义 变量定义之间使用逗号分隔*/
        var v2 = 100,v3;
        console.log(v2);//100
        console.log(v3);//undefined

概念 只定义，不初始化，然后在初始化值

var v;/*只定义，没有初始化*/
console.log(v);/* 结果为undefined(未定义)*/
v1 = "我是变量";/*初始化值（赋值）*/
        console.log(v1);

1.在内存空间中开辟一个指定的空间
作用—用于存储指定变量的致据信息(值)
a.没有初始化值时，默认为undefined
b.如果初始化值时，存储该数据信息(值)
2.当该变量初始化时
乖根据该变量指定的内存空间，数据进行更新

变量的命名

变量命名的规则

• 必须以字母，下划线(_)，美元符号，开始。
• 不要以数字开头。
• 不能使用关键字和保留字作为名称。
• 由于js是区分大小写的，大写字母与小的字母并不冲突。
• 名称最好是有明确的含义。
• 可以用“匈牙利命名法”，“下划线命名法”，“大小1驼峰命名法”。

4 - 数据类型

简单的数据类型	说明	默认值
Number	数字型，包含整型值和浮点型值，如21、0.21	0
Boolean	布尔值类型，如true .false，等价于1和0	false
String	字符串类型，如"张三”注意咱们js里面，字符串都带引号	“”
Undefined	var a;声明了变量a但是没有给值，此时a = undefined	Undefined
Null	var a = null;声明了变量a 为空值	null

1.1获取变量的属性typeof

代码展示

var a=100;
        console.log(typeof(a));
//输出number

5 - 运算符

1.1 算数运算符

+	加	1+1=2
-	减	2-1=1
*	乘	2*2=4
/	除	4/2=2
%	取余数	5%3=2

1.2 递增和递减运算符

a++	后加加
++a	前加加
a–	后减减
–a	前减减

案例理解

1. a++

var a = 10;
         console.log(a++)
         /* 最后的结果是 10 
         因为++在后所以先输出a
         在进行的加加。
         */

2. ++a

var a = 10;
         console.log(++a)
         /* 最后的结果是 11 
         因为++在前所以先进行++a
         在输出a。
         */

**3. a-- ** a–和a++的运行顺序是一样的

1.3 比较运算符

运算符名称	说明	案例	结果
<	小于号	1<2	true
>	大于号	2>1	true
=== !==	全等要求值和数据类型都一致	1===“1”	false
<=	小于等于	1<=1	true
>=	大于等于	1>=1	true
==	判断号	1 == 1 1==“1”	true
!=	不等号	1 != 1	false

在这其中比较容易弄混的是

1. 一个等号"="是赋值的意思
2. 两个等号"=="是判断的意思，就是判断两边值是否相等
3. 三个等号"==="是判断两边的值和数据类型是否相等

1.4 逻辑运算符

逻辑运算符	说明	案例	文字说明
&&	“逻辑与”，简称"与" and	true && fales	两边都是true结果为true，一边为fales，
||	“逻辑或”，简称"或" or	true || fales	一边为true 整个结果就为true
！	“逻辑非”，简称"非" not	！true	不为true

6 - if语句

1.1 if语句

• if语句的语法结构

if(条件表达式){
            //条件成立所要执行的语句
         }

• 执行流程

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-bUx1yauG-1600949991425)(D:\桌面1\HTML资料\QQ截图20200924192114.png)]

• if else语句(双分支语句)

//条件成立执行if里面的语句 ，否则执行else里面的语句
         if(条件表达式){
            //[如果条件成立]执行这里的语句
         }else{
            //[否则]执行这里的语句
         }

• 执行流程

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-iHGPsKBb-1600949991432)(D:\桌面1\HTML资料\QQ截图20200924193925.png)]

1.2 三元表达式

• 语法结构

 (expr1) ? (expr2) : (expr3)

• 执行思路
  • 如果表达式1为true，则返回表达式2的值，如果表达式1为false，则返回表达式3的值
  • 简单理解:就类似于if else(双分支)的简写

1.3 switch语句

代码语句

varday = 1;

        switch (day) {
            case 1:
                document.write('星期一');
                break;
            case 2:
                document.write('星期二');
                break;
            default: document.write('上面都不满足的结果');
                break;
        }

7 - 循环

1.1 for循环

• 语法结构

  for（初始化变量；条件表达式；操作表达式）{
  	//循环体
  }
  

名称	作用
初始化变量	通常被用于初始化一个计数器，该表达式可以使用 var 关键字声明新的变量，这 个变量帮我们来记录次数。
条件表达式	用于确定每一次循环是否能被执行。如果结果是 true 就继续循环，否则退出循 环。
操作表达式	用于确定每一次循环是否能被执行。如果结果是 true 就继续循环，否则退出循 环。

执行过程：

1. 初始化变量，初始化操作在整个 for 循环只会执行一次。
   执行条件表达式，如果为true，则执行循环体语句，否则退出循环，循环结束。
2. 执行操作表达式，此时第一轮结束。
3. 第二轮开始，直接去执行条件表达式（不再初始化变量），如果为 true ，则去执行循环体语句，
   否则退出循环。
4. 继续执行操作表达式，第二轮结束。
5. 后续跟第二轮一致，直至条件表达式为假，结束整个 for 循环。

代码案例展示

• for循环重复相同的代码

  1.例如输出10句“我是for循环”

  for(i=1;i<=10;i++){
              console.log("我是for循环")
          }
  

  2.例如输出1-100的数字

  for(i=1;i<=100;i++){
              console.log(i)
          }
  

1.2 双重for循环

• 双重for循环的介绍

  循环嵌套是指在一个循环语句中再定义一个循环语句的语法结构，例如在for循环语句中，可以再嵌
  套一个for 循环，这样的 for 循环语句我们称之为双重for循环
  

• 双重for循环的语法

  for (外循环的初始; 外循环的条件; 外循环的操作表达式) {
    for (内循环的初始; 内循环的条件; 内循环的操作表达式) { 
     需执行的代码;
   }
  }
  

• 内层循环可以看做外层循环的循环体语句

• 内层循环执行的顺序也要遵循 for 循环的执行顺序

• 外层循环执行一次，内层循环要执行全部次数

代码的练习

1.打印一个五行五列的星星

var star = '';
for (var j = 1; j <= 3; j++) {
  for (var i = 1; i <= 3; i++) {
   star += '☆'
 }
  // 每次满 5个星星 就 加一次换行
  star += '\n'
}
console.log(star);

核心逻辑：
1.内层循环负责一行打印五个星星
2.外层循环负责打印五行

九九乘法表练习

var a=0  //首先定义一个变量，a=0;
        for(i=1;i<=9;i++){//外层循环控制被乘数控制内循环次数
            for(j=1;j<=i;j++){//内循环控制乘数，外层循环循环一次内部循环循环一遍
                a=i*j;//算法，每次吧i*j的值赋值到a里面
                document.write(i+"*"+j+"="+a+"\n")//打因出乘法表的格式，里面‘+’是连接符
            }
            document.write("<br/>")//两次循环结束后进行换行
        }

1.3 for 循环小结

for 循环可以重复执行某些相同代码
for 循环可以重复执行些许不同的代码，因为我们有计数器
for 循环可以重复执行某些操作，比如算术运算符加法操作
随着需求增加，双重for循环可以做更多、更好看的效果
双重 for 循环，外层循环一次，内层 for 循环全部执行
for 循环是循环条件和数字直接相关的循环

2.1 while循环

while语句的语法结构如下：

while (条件表达式) {
  // 循环体代码
}

执行思路：
1 先执行条件表达式，如果结果为 true，则执行循环体代码；如果为 false，则退出循环，执行后
面代码
2 执行循环体代码
3 循环体代码执行完毕后，程序会继续判断执行条件表达式，如条件仍为true，则会继续执行循环
体，直到循环条件为 false 时，整个循环过程才会结束
注意：
使用 while 循环时一定要注意，它必须要有退出条件，否则会成为死循环

8 - 数组

1.1 数组的概念

• 数组可以把一组相关的数据一起存放，并提供方便的访问(获取）方式。
• 数组是指一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素。数组
  是一种将一组数据存储在单个变量名下的优雅方式。

1.2 创建数组

js中创建数组有两种方式：

• 利用 new 创建数组

  var 数组名 = new Array() ；
  var arr = new Array();  // 创建一个新的空数组
  

  注意Array()，A要大写

• 利用数组字面量

  //1. 使用数组字面量方式创建空的数组
  var  数组名 = []；
  //2. 使用数组字面量方式创建带初始值的数组
  var  数组名 = ['小白','小黑','大黄','瑞奇'];
  

  • 数组的字面量是方括号 [ ]
  • 声明数组并赋值称为数组的初始化

• 数组元素的类型

  数组可以存放任意的数据类型

  var arr = ['小明',14,28.9]
  

1.3 获取数组中的元素

数组中是用数组的下标用来访问数组的序列号（数组下标是从0开始的）

var arr = ['小白','小黑','小红','小绿'];
//索引号：    0      1      2      3

数组可以通过索引来访问，修改，添加，删除，相对应的元素。

例子

 var arr = ['小白','小黑','小红','小绿'];
 //索引号：    0      1      2      3
        console.log(arr[2])
        //这是用索引来访问索引为2的元素，这是打印出‘小红’

**注意：**如果访问时数组没有和索引值相对应的元素，则得到的值就是undefined

1.4 遍历数组

• 数组遍历
  把数组中的每个元素从头到尾都访问一次（类似学生的点名），可以通过 for 循环索引遍历数
  组中的每一项

var arr = ['小白','小黑','小红','小绿'];
        for(var i=0;i<arr.length;i++){
            console.log(arr[i]);
        }

• 数组的长度

  数据组的长度在默认情况下就是数组元素的个数

  获取数组数量的关键字是length

 var arr = ['小白','小黑','小红','小绿'];
        console.log(arr.length)

注意

• 此处数组的长度是数组元素的个数 ，不要和数组的索引号混淆。
• 我们数组里面元素数量变化时length的属性也会跟着变化
• 如果设置的length属性值大于数组的元素个数，则会在数组末尾出现空白元素；
• 如果设置的length属性值小于数组的元素个数，则会把超过该值的数组元素删除

1.5 数组中新增元素

数组可以通过以下方式在数组的尾部插入新元素

数组[数组.length]=新值；

9 - 函数

1.1 函数的概念

在 JS 里面，可能会定义非常多的相同代码或者功能相似的代码，这些代码可能需要大量重复使
用。虽然 for循环语句也能实现一些简单的重复操作，但是比较具有局限性，此时我们就可以使用 JS 中
的函数。

函数：就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用。

1.2 函数的使用

声明函数

// 声明函数
function 函数名() {
  //函数体代码
}

• function 是声明函数的关键字,必须小写
• 由于函数一般是为了实现某个功能才定义的， 所以通常我们将函数名命名为动词，比如 getSum