JavaScript基础笔记（部分）

2022-11-12 16:02:08

JavaScript笔记

一、了解JS

1.在一个网页里面，html表示结构，css表示样式，JS表示行为；

2.JS的三大核心：

ECMAScript：JS的标准，语法
BOM（Browaer Object Model）: 就是一整套操作浏览器的属性和方法
DOM（Document Object Model）:就是一整套操作文档流的属性和方法

3.JS的本质：1.就是通过JS的语法，让浏览器发生变换；2.让文档发生变化

二、JS的书写

分成三种方式

1.行内式（强烈不推荐）

2.内嵌式（不推荐）

3.外链式（推荐）

1.行内式 JS 代码

a标签

因为a标签本身就有行为出现
当我点击的时候，需要区分你是跳转链接还是执行JS代码
在href属性里面书写一个 javascript:JS代码

非a标签

因为没有自己的行为，我们需要给他加一个行为
写一个 onclick 属性，表示当点击时
属性值的位置书写 JS 代码
//

接触第一个 JS 代码

alert(‘hello world’)
这是一段 JS 代码
含义：在浏览器弹出一个提示框，里面有一段文本，是 hello world
注意：写在小括号里面的需要用引号包裹，如果是数字不需要

2.内嵌式 JS 代码

在页面内书写一个 script 标签
把 JS 代码书写在标签对内部
注意：不需要任何行为，只要打开页面就会执行
特点：
1. 在一个页面内可以书写无限个 script 标签（会按照从上到下的顺序依次执行）
2. 理论上 script 标签可以放在页面的任何位置
  - 推荐放在 body 的末尾或者 head 的末尾
  - 目前推荐放在 body 的末尾

3.外链式 JS 代码

把 JS 代码写在一个 .js后缀的文件里面
在页面上通过 script 标签的 src 属性引入页面
注意：不需要任何行为，只要打开页面就会执行
特点:

和内嵌式一样
当一个 script 标签被当作外链式使用的时候，那么写在标签对里面的内容没有意义

哪怕你写了 src 属性，但是没有引入文件，也不能当作内嵌式使用了

三、JS 的注释

JS 里面注释分两种：

单行注释//
多行注释/**/：一次性注释一段代码

注释掉的代码不执行。

四、JS的输出语法

1.alert()

以浏览器弹出层的形式展示内容
小括号里面书写你要书写的内容
只要不是纯数字，都用引号包裹（单双引号无所谓）

2.console.log()

在浏览器控制台打印你要输出的内容
小括号里面书写你要书写的内容
只要不是纯数字，都用引号包裹

3.document.write()

在页面直接写出你要输出的内容
小括号里面书写你要书写的内容
只要不是纯数字，都用引号包裹
特殊：因为是直接把内容输出到页面上，所以可以解析标签
```
document.write('<h1>')
document.write('How are you?')
document.write('</h1>')
```
页面就会把“How are you?”以 h1 标题标签显示出来。console.log()也可以这样，但是没有意义。

五、JS 的变量

在一段程序运行中，保存一个中间值的使用。

JS 定义变量

语法：var 变量名 = 值
- var :定义变量的关键字
- 空格：分隔变量名和关键字的，必须有
- 变量名：你自己起的一个名字，用来代表后面的一串东西
- 等于号：在 JS 里面，等于号是赋值的意思，把右边的内容给到左边的变量名
- 值：你定义变量代表的内容
特点：
1. 一个变量只能保存一个值（当你给他第二个值的时候，第一个值就被覆盖了）

一个变量如果你想让他保存多个数据（从原则上不可以，但我们的某些数据类型可以)
没有 var 关键字可不可以定义变量？（可以，但强烈不建议这样使用。）
尽可能保持代码结构（先定义，后使用）

定义变量的几种情况
1. 定义一个变量不进行赋值： var 变量名；
2. 使用一个关键字同时定义多个变量：多个变量名之间用逗号隔开。 var a, b, c;
3. 定义多个变量的时候，可以赋值，可以不赋值。 var n1 = 10, n2, n3=20;

六、变量的命名规则和命名规范

规则：你必须遵守，不然报错
- 一个变量只能由数字（0-9），字母（a-z A-Z），美元符（$），下划线（__）组成。
- 一个变量不能由数字开头
- 在 JS 中，严格区分大小写（num Num NUm NUM 这是四个变量）
- 不能使用关键字或保留字
  - 关键字：现在 JS 语法正在使用的关键字（var）
  - 保留字：现在 JS 还没用，但是将来可能会用的
规范：建议你遵守，因为大家都这样
- 不要用中文命名
- 变量语义化——尽可能使用一个有意义的单词
- 驼峰命名法——当一个变量名由多个单词组成的时候，第二个单词开始，首字母大写

七、JS的数据类型

JS 把一个变量可以存储的各种各样的数据，做了一个区分，分成了两个大的类型。

基本数据类型（简单数据类型）
1. Number 数值
  - 一切十进制表示的数字
  - 一切浮点数（小数）
  - 其他进制表示的数字
    1. 十六进制，以 0x 开头
    2. 八进制，以 0 开头
    3. 二进制，以 0b 开头
  - 科学计数法：比较大的数字使用科学计数法表示（2e5 —> 2*10的5次方）
  - NaN :Not a Number ——>非数字
2. String 字符串
  - 在 JS 里面一切使用引号（双引号，单引号，反引号）包裹的内容都是字符串
  - 表示一段文本内容，是一个字符一个字符连接起来的内容
  - 当你在字符串里面只写数字的时候，也不是数值类型，是字符串类型。
  - 在字符串里面，空格是占位的。
3. Boolean 布尔（只有两个值，主要用来做判断）
  - true 表示真，在计算机存储的时候就是1
  - false 表示假，在计算机存储的时候就是0
4. Undefined 空（未定义）
  - 只有一个值：undefined
  - 这里本该有一个值，但是没有，就是 undefined
5. Null 空
  - 只有一个值
  - 这里有一个值，有一个空值。
复杂数据类型（地址数据类型 / 引用数据类型）
1. Object
2. Function

八、检测数据类型

在运算过程中，有的数据不是我们自己写的，有可能是通过运算得到的，有可能是别人给的。为了保证程序的正确运行，我们需要检测数据变量。

关键字 typeof

两种用法：
1. typeof 变量
  - 语法：typeof 要检测的变量
  - 返回值（结果）：以字符串的形式给你的变量数据类型
2. typeof (变量)
  - 语法： typeof (要检测的变量)
  - 返回值：以字符串的形式给你的变量数据类型
两种语法的区别：
1. typeof 只能检测紧跟着的一个变量
2. typeof （）先运算小括号里面的结果，再用typeof 去检测结果的数据类型
typeof 的返回值
- 注意：typeof 的返回值是一个字符串
- 当两个及以上 typeof 连用的时候，一定得到 string
- 只能准确的检测基本数据类型
  1. 数值：number
  2. 字符串：string
  3. 布尔：boolean
  4. undefined: undefined
  5. null: object

九、数据类型的转换

转数值：把其他数据类型转换成数值类型
1. Number()
  - 语法:Number(你要转换的数据)
  - 返回值：转换好的数据
  - 特点：
    1. 会把你要转换的内容当作一个整体来看
    2. 能转换成数字结果，就是数字结果
    3. 不能转换成数字结果，就是 NaN
2. parseInt()
  - 语法：parseInt(你要转换的数据)
  - 返回值：转换好的数据
  - 特点：
    1. 会把你要转换的任何内容一位一位的看
    2. 如果第一位就不能转换成数字，那么直接 NaN
    3. 如果第一位可以，就看第二位，第一位保留
    4. 以此类推，直到一个不能转换成合法数字的位置为止
    5. 注意：不认识小数点
3. parseFloat()
  - 语法：parseFloat(你要转换的数据)
  - 返回值：转换好的数据
  - 特点：
    1. 和 parseInt 的解析规则一模一样
    2. 只不过多认识一个小数点
4. 取正负值
  - 语法: +变量或者 -变量
  - 返回值：转换好的数据结果
  - 特点：和 Number的解析规则一模一样
啊不想写了就这样,对不住了！

码农公寓