JS是什么

JS是一种运行在客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来HTML网页增加动态功能浏览器就是一种运行JS脚本语言的客户端，JS的解释器被称为JS引擎，为浏览器的一部分.

js 的三种书写方式

行内式

<input type="button" value="按钮" onclick="alert('hello world')" />

内嵌式

<body>
alert('hello world')
</body>

外链式

<script src="main.js"></script>

什么是变量？

变量是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据。

简单来说就是，我有一个东西需要暂时存储起来，比如说就是一个数字 100，我把它存放到了变量 a 中，我后续想要使用他的时候就可以直接通过变量 a 获取到数字 100变量其实就相当于一个容器，内部可以存储任意类型的数据，使用变量时，用的是内部存储的数据。

为什么要定义变量？

使用变量可以方便的获取或者修改内存中的数据

如何定义变量

使用一个 var 的关键字进行定义，后面必须加一个空格，空格后面自定义变量名

变量赋值

变量定义之后，初始时没有进行赋值，内部有一个默认存储的值叫 undefined(未定义) 表示内部未赋值，但可以存储数据了

变量赋值的方式：通过等号 = 赋值，等号右边的值赋值给左边的变量等号在 JS 中叫做赋值号；书写时，等号 = 两侧习惯书写一个空格

变量定义

        var a;

变量赋值

        a = 1;

变量定义并赋值

        var b = 2;

使用变量

直接写变量名即可使用变量；变量在使用前，必须先有定义，如果没有定义，会出现引用错误

变量命名规则（必须遵守，不遵守会报错）

由字母、数字、下划线、$符号组成，不能以数字开头
字母区分大小写
不能是关键字和保留字： 1.关键字指的是js中有特殊功能的小词语，比如var、for等 2.保留字指的是现在没有特殊功能，但是将来新语法中有可能作为关键字使用

变量命名规范（建议遵守的，不遵守不会报错）

变量名必须有意义

横杠连接(中划线)：

big-box (class类名可以, 变量名不行)
下划线 big_box (class类名, 变量都可以)

遵守驼峰命名法：

两个单词拼接时, 第二个单词的首字母大写

使用变量

    console.log(a)  // undefined
    console.log(box)    // undefined

    var a = 'abc'
    var box = 123

    console.log(a)  // abc
    console.log(box)    // 123

预解析之后

        // var a;
        // var box;

        // console.log(a)
        // console.log(box)

        // a = 'abc'
        // box = 123

        // console.log(a)
        // console.log(box)

js 数据类型

1. Number(数据)方法

转型函数Number()可以用于任何数据类型，将其他数据类型转为数字
字符串：纯数字字符串转为对应数字，空字符串和空白字符串转为0，非空非纯数字字符串转为NaN 布尔值：true转为1，false转为0 undefined：转为NaN null：转为0

2. parseInt()方法：

字符串转整数方法
对浮点数进行取整操作
对数字取整直接舍弃小数部分，只保留整数
将字符串转为整数数字
将字符串转为整数数字，也包含取整功能
字符串中，必须是纯数字字符串或者数字字符开头的字符串，才能转换为正常数字，且只取整数部分如果不是数字打头的字符串，会转换为NaN

3. parseFloat()方法：

字符串转浮点数方法
将字符串转为浮点数数字
满足浮点数数字字符必须在字符串开始，如果不在开始返回值都是NaN

转字符串

变量.toString()方法

console.log(typeof a.toString())

String(变量)方法，有些值没有toString()，这个时候可以使用String()。比如undefined和null toString 方法, number类型可以调用

  * boolean 类型, 可以调用
  * undefined 不能使用 toString 方法
  * null 不能使用 toString 方法
  * 如果想将 undefined 或者 null 转换为 string 类型,
  *     1. 可以通过 + '' 的方式
  *     2. String(变量)

+号拼接字符串方式

console.log(100 + 300)  // 400
console.log(100 + '300')    // 100300

转布尔

Boolean(变量)方法

转型函数Boolean()可以用于任何数据类型，将其他数据类型转为布尔类型的值
转为false：NaN、0、“”空字符串、null、undefined
转为true：非0 非NaN数字、非空字符串

JS 运算符 + - * / %

隐式转换: JS 内部帮助我们转换的
显式转换: 我们自己手动通过方法转换数据类型
除了加法数据类型不是 number 类型时会进行拼接, 其他都不会拼接, 会隐式转换

        console.log(1 + 2)  // 3
        console.log(1 + '2')    // 12

        console.log(2 - 2)  // 0
        console.log(2 - '2')  // 2 - '2'    --> 2 -2    == 0

        console.log(1 * 3)  // 3
        console.log(1 * '3')  // 1 * '3'    --> 1 * 3   == 3

        console.log(3 / 1)  // 3
        console.log(3 / '1')  // 3 / '1'    --> 3 / 1   == 3

        console.log(7 % 2)  // 1
        console.log(7 % '2')  // 7 % '2'    --> 7 % 2   == 1

JS 的赋值

可以用赋值号赋值(=) += -= *= /= %=

1.做什么的运算
2.可以不用可以 3.用了有什么好处：简化代码量

        // a = a + 1
        // 我自身   赋值为   我自身 + 1
        // a += 1  // a = a + 1

        // a += 10 // a = a + 10   ---> a == 1         a = 1 + 10      a == 11 

        // a = a - 1   // 我自身   赋值为  我自身    -   1
        // a -= 1  // 0

        // a = a * 2   // 2
        // a *= 2  // 2

        // a = a / 1   // 1
        // a /= 1  // 1

        // a =  a % 1  // 0
        // a %= 1  // 0

比较运算符

（ > < >= <= == === != !==）

    // console.log(1 > 2)  // false
    // console.log(1 < 2)  // true
    // console.log(2 >= 2)  // true
    // console.log(2 <= 2)  // true

== 等于
= 赋值
=== 全等

== 和 === 作用一样, 用于对比两侧数据是否相等
== 只对比数据, 不对比数据类型
=== 对比数据, 且对比数据类型

== 在对比数据时, 两侧数据不同, 比如一侧时数字, 一侧时字符串, 会进行隐式转换

 // console.log(2 == 2) // true
 // console.log(2 === 2) // true
 // console.log(2 == '2') // true
 // console.log(2 === '2') // false

!= 不等于
!== 不全等于

两者作用相同, 用于对比两侧数据是否相同, 相同时返回 false, 不相同返回 true

!= 只对比数据, 不对比数据类型 (会进行隐式转换, 转换为相同类型在对比)

!== 对比数据, 且对比数据类型

  // console.log(2 != 2) // false
  // console.log(2 !== 2) // false
  // console.log(2 != '2') // false
  // console.log(2 !== '2') // true

逻辑运算符

&& (逻辑与；逻辑且)
|| (逻辑或)
! (非, 取反, 逻辑非)

逻辑与

语法:

变量1 && 变量2
表达式1 && 表达式2

返回方式:

前一个为真, 就返回后一个

前一个为假, 就返回第一个

  // var bo = true && false  // 前一个为真, 返回后一个, 所以会把 false 返回
  // var bo1 = false && true  // 前一个为假, 直接返回前一个, 所以会把 false 返回
  // console.log(bo) // false
  // console.log(bo1)    // false

  // var bo = 0 && 1
  // var bo = 0 && 1
  // 逻辑与 左侧为 0 右侧为 1
  // 0 转为 布尔值 会转为false (非0即为真)
  // 按照逻辑与的返回方式, 前一个为假(左侧为假), 那么会返回 第一个(左侧的)
  // 所以此时 bo 的值 为 0
  // console.log(bo) // 0

  // var bo = 1 && 0
  // var bo = 1 && 0
  // 逻辑与 左侧 1 右侧 0
  // 1 转为布尔值 会转为 ture (非0即为真)
  // 按照逻辑与的返回方式
  // 前一个为真, 会返回后一个
  // 所以此时 bo 的值为 0
  // console.log(bo)  // 0

逻辑或

语法:

变量1 || 变量2
表达式1 || 表达式2