Java Script 学习笔记1 一

烟雨小城
78 阅读12分钟

image.png

一.JS的表现形式

  • js 也有多种方式书写，分为 行内式， 内嵌式，外链式
  • 注释
    • 可以直接写两个 / ，也可以按 ctrl + /
    • 可以直接写 /**/ 然后在两个星号中间写注释

二.变量

  1. 一个变量名只能存储一个值
  2. 当再次给一个变量赋值的时候，前面一次的值就没有了
  3. 变量名称区分大小写（JS 严格区分大小写）
  1. 一个变量名称可以由 数字、字母、英文下划线（_）、美元符号（$） 组成，不能用别的符号，符号在前面在后面都可以
  2. 严格区分大小写
  3. 不能由数字开头
  4. 不能是 保留字（未用到但保留的字） 或者 关键字（已经用到的字）
  5. 变量命名不要出现空格

三.数据类型

3-1 分类

1. 数值类型（number）
  • 18，12.59(浮点数），2e3，十六进制，八进制，二进制（默认十进制）,NaN
  • 一切数字都是数值类型（包括二进制，十进制，十六进制等）
  • NaN（not a number），一个非数字
2. 字符串类型（string）
  • 被引号包裹的所有内容（可以是单引号也可以是双引号）
3. 布尔类型（boolean）
  • 只有两个（true 或者 false）
4. null类型（null）
  • 只有一个，就是 null，表示空的意思
5. undefined类型（undefined）
  • 只有一个，就是 undefined，表示没有值的意思
6.symble

3-2 判断数据类型

  • 使用 typeof 关键字来进行判断

3-3 数据类型转换

3-3-1.其他数据类型转成数值

  1. Number(变量)

可以把一个变量强制转换成数值类型

可以转换小数，会保留小数

可以转换布尔值

遇到不可转换的都会返回 NaN

  1. parseInt(变量)

从第一位开始检查，是数字就转换，直到一个不是数字的内容

开头就不是数字，那么直接返回 NaN

不认识小数点，只能保留整数

  1. parseFloat(变量)

从第一位开始检查，是数字就转换，直到一个不是数字的内容

开头就不是数字，那么直接返回 NaN

认识一次小数点

  1. 除了加法以外的数学运算

运算符两边都是可运算数字才行

如果运算符任何一遍不是一个可运算数字，那么就会返回 NaN

加法不可以用

3-3-1.其他数据类型转成字符串

  1. String(变量)

    所有数据类型都可以转成字符串

  2. 变量.toString()

    有一些数据类型不能使用 toString() 方法，比如 undefined 和 null

  3. 使用加法运算

    在 JS 里面，+ 由两个含义

    字符串拼接： 只要 + 任意一边是字符串，就会进行字符串拼接

    加法运算：只有 + 两边都是数字的时候，才会进行数学运算

3-3-1.其他数据类型转成布尔

Boolean(变量)

在 js 中，只有 ''、0、null、undefined、NaN，这些是 false

其余都是 true

四.运算符

4-1 数学运算符

+ - * / %

4-2 赋值运算符

= += -= *= /= %=

4-3 比较运算符

== === != !== >= <= > <

4-4 逻辑运算符

&& || !

4-5 自增自减运算符

++ --

4-6 三元运算符(三目运算符)

  • 三元运算，就是用 两个符号 组成一个语句

  • 语法： 条件 ? 条件为 true 的时候执行 : 条件为 false 的时候执行

五.语句

5-1 IF 条件分支结构（重点）

if 语句

  • 通过一个 if 语句来决定代码是否执行

  • 语法： if (条件) { 要执行的代码 }

  • 通过 () 里面的条件是否成立来决定 {} 里面的代码是否执行

if else 语句

  • 通过 if 条件来决定，执行哪一个 {} 里面的代码

  • 语法： if (条件) { 条件为 true 的时候执行 } else { 条件为 false 的时候执行 }

  • 两个 {} 内的代码一定有一个会执行

if else if ... 语句

  • 可以通过 if 和 else if 来设置多个条件进行判断

  • 语法：if (条件1) { 条件1为 true 的时候执行 } else if (条件2) { 条件2为 true 的时候执行 }

  • 会从头开始依次判断条件

    • 如果第一个条件为 true 了，那么就会执行后面的 {} 里面的内容
    • 如果第一个条件为 false，那么就会判断第二个条件，依次类推

  • 多个 {} ，只会有一个被执行，一旦有一个条件为 true 了，后面的就不在判断了

if else if … else 语句

  • 和之前的 if else if ... 基本一致，只不过是在所有条件都不满足的时候，执行最后 else 后面的 {}

5-2 SWITCH 条件分支结构（重点）

  • 也是条件判断语句的一种

  • 是对于某一个变量的判断

  • 精准匹配

六. 循环结构（重点）

  • 根据某些给出的条件，重复的执行同一段代码
  • 循环必须要有某些固定的内容组成
    1. 初始化
    2. 条件判断
    3. 要执行的代码
    4. 自身改变

6-1 WHILE 循环

  • while，中文叫 当…时，其实就是当条件满足时就执行代码，一旦不满足了就不执行了

  • 语法 while (条件) { 满足条件就执行 }

  • 因为满足条件就执行，所以我们写的时候一定要注意，就是设定一个边界值，不然就一直循环下去了

6-2 DO WHILE 循环

  • 是一个和 while 循环类似的循环

  • while 会先进行条件判断，满足就执行，不满足直接就不执行了

  • 但是 do while 循环是，先不管条件，先执行一回，然后在开始进行条件判断

  • 语法： do { 要执行的代码 } while (条件)

6-3 for 循环

  • 和 while 和 do while 循环都不太一样的一种循环结构

  • 道理是和其他两种一样的，都是循环执行代码的

  • 语法： for (var i = 0; i < 10; i++) { 要执行的代码 }

6-4 BREAK 终止循环

  • 在循环没有进行完毕的时候，因为我设置的条件满足，提前终止循环

  • 比如：我要吃五个包子，吃到三个的时候，不能在吃了，我就停止吃包子这个事情

  • 要终止循环，就可以直接使用 break 关键字

6-5 CONTINUE 结束本次循环

  • 在循环中，把循环的本次跳过去，继续执行后续的循环

  • 比如：吃五个包子，到第三个的时候，第三个掉地下了，不吃了，跳过第三个，继续吃第四个和第五个

  • 跳过本次循环，就可以使用 continue 关键字

七.函数

  • 对于 js 来说，函数就是把任意一段代码放在一个 盒子 里面

  • 在我想要让这段代码执行的时候，直接执行这个 盒子 里面的代码就行

7-1 函数定义阶段

  • 定义阶段就是我们把代码 放在盒子里面

  • 我们就要学习怎么 放进去，也就是书写一个函数

  • 我们有两种定义方式 声明式 和 赋值式

声明式

  • 使用 function 这个关键字来声明一个函数

赋值式

  • 其实就是和我们使用 var 关键字是一个道理了

  • 首先使用 var 定义一个变量，把一个函数当作值直接赋值给这个变量就可以了

7-2 函数调用阶段

  • 就是让 盒子里面 的代码执行一下
  • 让函数执行
  • 两种定义函数的方式不同，但是调用函数的方式都以一样的

调用一个函数

  • 函数调用就是直接写 函数名() 就可以了
  • 定义完一个函数以后，如果没有函数调用，那么写在 {} 里面的代码没有意义，只有调用以后才会执行

7-3 调用上的区别

  • 虽然两种定义方式的调用都是一样的，但是还是有一些区别的

  • 声明式函数： 调用可以在 定义之前或者定义之后

  • 赋值式函数： 调用只能在 定义之后

7-4 函数的参数

  • 我们在定义函数和调用函数的时候都出现过 ()
() 的作用

  • 就是用来放参数的位置

  • 参数分为两种 行参 和 实参

行参和实参的作用

  1. 行参

    • 就是在函数内部可以使用的变量，在函数外部不能使用

    • 每写一个单词，就相当于在函数内部定义了一个可以使用的变量（遵循变量名的命名规则和命名规范）

    • 多个单词之间以 , 分隔

    • 如果只有行参的话，那么在函数内部使用的值个变量是没有值的，也就是 undefined

    • 行参的值是在函数调用的时候由实参决定的

  2. 实参

    • 在函数调用的时候给行参赋值的

    • 也就是说，在调用的时候是给一个实际的内容的

    • 函数内部的行参的值，由函数调用的时候传递的实参决定

    • 多个参数的时候，是按照顺序一一对应的

参数个数的关系

  1. 行参比实参少

    • 因为是按照顺序一一对应的

    • 行参少就会拿不到实参给的值，所以在函数内部就没有办法用到这个值

  2. 行参比实参多

    • 因为是按照顺序一一对应的

    • 所以多出来的行参就是没有值的，就是 undefined

7-5 函数的return

  • return 返回的意思，其实就是给函数一个 返回值 和 终断函数

返回值

  • 函数调用本身也是一个表达式，表达式就应该有一个值出现

  • 现在的函数执行完毕之后，是不会有结果出现的

  • return 关键字就是可以给函数执行完毕一个结果

  • 我们可以在函数内部使用 return 关键把任何内容当作这个函数运行后的结果

  • return用不用看需求，只有一个函数时可以不用return，要想下一个函数用上一个函数的结果就要用return

  • 函数中{}内，return后面无法执行

终断函数

  • 当我开始执行函数以后，函数内部的代码就会从上到下的依次执行

  • 必须要等到函数内的代码执行完毕

  • 而 return 关键字就是可以在函数中间的位置停掉，让后面的代码不在继续执行

7-6 预解析（重点）

变量声明提升

  • 预解析 其实就是聊聊 js 代码的编译和执行
  • js 是一个解释型语言，就是在代码执行之前，先对代码进行通读和解释，然后在执行代码
  • 也就是说，我们的 js 代码在运行的时候，会经历两个环节 解释代码 和 执行代码

解释代码

  • 因为是在所有代码执行之前进行解释，所以叫做 预解析（预解释）

  • 需要解释的内容有两个

    • 声明式函数
      • 在内存中先声明有一个变量名是函数名，并且这个名字代表的内容是一个函数
    • var 关键字
      • 在内存中先声明有一个变量名
    • 声明式函数预解析会直接解析出内容，var 关键字预解析会显示undefind

  • 赋值式函数会按照 var 关键字的规则进行预解析

7-7 重名问题

  • 声明不能跨 <script> 标签提升，访问可以跨<script>标签

7-8 作用域

  • 作用域，就是一个变量可以生效的范围
  • 变量不是在所有地方都可以使用的，变量的使用范围就是作用域

全局作用域

  • 全局作用域是最大的作用域

  • 在全局作用域中定义的变量可以在任何地方使用

  • 页面打开的时候，浏览器会自动给我们生成一个全局作用域 window

  • 这个作用域会一直存在，直到页面关闭就销毁了

局部作用域

  • 局部作用域就是在全局作用域下面有开辟出来的一个相对小一些的作用域

  • 在局部作用域中定义的变量只能在这个局部作用域内部使用

  • 在 JS 中只有函数能生成一个局部作用域，别的都不行

  • 每一个函数，都是一个局部作用域

7-9 变量使用规则

  • 有了作用域以后，变量就有了使用范围，也就有了使用规则
  • 变量使用规则分为两种，访问规则 和 赋值规则

访问规则

  • 当我想获取一个变量的值的时候，我们管这个行为叫做 访问

  • 获取变量的规则：

    • 首先，在自己的作用域内部查找，如果有，就直接拿来使用
    • 如果没有，就去上一级作用域查找，如果有，就拿来使用
    • 如果没有，就继续去上一级作用域查找，依次类推
    • 如果一直到全局作用域都没有这个变量，那么就会直接报错（该变量 is not defined）

  • 变量的访问规则 也叫做 作用域的查找机制

  • 作用域的查找机制只能是向上找，不能向下找

赋值规则

  • 当你想给一个变量赋值的时候，那么就先要找到这个变量，在给他赋值

  • 变量赋值规则：

    • 先在自己作用域内部查找，有就直接赋值
    • 没有就去上一级作用域内部查找，有就直接赋值
    • 还没有再去上一级作用域查找，有就直接赋值
    • 如果一直找到全局作用域都没有，那么就把这个变量定义为全局变量，再给他赋值
avatar
文章
阅读
粉丝