第一章、初识js

一、sass

1.嵌套方法：

后代

.box{
    div{
        width:100px;
    }
}

子代：

ul{
    >li{
        width：10px;
    }
}

划过显示：

div{
    &:hover{
        color:$color;
    }
}

注意：$名字为sass中定义变量的写法。

二、JS是什么

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

三、JS的组成

JavaScript是由ECMAScript、DOM、BOM组成

ECMAScript: 定义了JavaScript 的语法规范，描述了语言的基本语法和数据类型
DOM：文档对象模型
BOM：可以操作浏览器，比如：弹出框、浏览器跳转、获取分辨率……

四、JS的书写方法

行内式：

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

onclick这一部分就是行内式的内容

内部式（内嵌式）：

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

外链式：

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

一般写在body的底部

五、变量

定义变量：var
给变量赋值： = （两边都有空格）

重点内容：

在 sass 中如何定义变量
在 sass 中如何书写嵌套(如何书写后代? 如何书写子类)
JS 是什么
JS 由什么组成
JS 的三种书写方式
JS 中如何定义一个变量 (关键字是什么? 语法是什么? 如何赋值?)

第二章、变量/运算符

一、变量

1.变量的命名

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

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

变量名必须有意义
遵守驼峰命名法

二、数据类型

简单数据类型 (基本数据类型)
- 1.1 数字类型(number): 所有的整数和浮点数
- 1.2 字符串类型(string): 在 JS 中, 只要是引号包裹的内容, 统称为字符串
- 1.3 布尔类型(boolean): 表明对/错(真/假)
- 1.4 undefined类型 (undefined): 表明未定义, 通常我们不会给一个变量赋值为 undefined, 因为变量定义但不赋值就是一个 undefined
- 1.5 null类型(null): 表明为空对象指针 (空), 一般很少使用, 但是如果创建了一个对象, 但是不知道对象的值是什么的时候可能会给一个 null

2.复杂数据类型 (引用数据类型)

三、数据类型的检测

关键字：typeof

四、类型转换

（一）数据类型转换

JS 转换的时候任意类型都能够转换为数字使用, 主要是字符串转数字

1. 借助一个转型函数 Number(数据)
- 1.1 字符串：纯数字字符串转为对应数字，空字符串和空白字符串转为0，非空非纯数字字符串转为NaN
- 1.2 布尔值：true转为1，false转为0
- 1.3 undefined：转为NaN；null：转为0
1. parseInt(数据)
- 2.1 parseInt 如果传递的是一个数字, 那么会忽略小数点以后的所有内容
- 2.2 如果不是数字打头的字符串，会转换为NaN
- 2.3 字符串中，必须是纯数字字符串或者数字字符开头的字符串，才能转换为正常数字，且只取整数部分
1. parseFloat(数据) 参考上述的 parseInt 自己整理练习
1. 变量/数据 - 0

（二）转字符串类型

1. 变量/数据.toString()
- 问题: undefined 和 null 不能使用
1. String(变量/数据)
- 什么类型都能转换为字符串
1. 变量/数据 + ''

（三）布尔类型转换

一般开发的时候不会主动的转换布尔类型
一般是隐式转换, 也就是由 JS 帮我们完成了数据的转换, 一般做判断的时候比较常见
- 1. 借助一个转型函数 Boolean(变量/数据)
- 1. !!变量/数据
  - 一个 ! 表示得到这个数据取反后的布尔值

- 注意

1.非0即为真
2.非空即为真

五、运算符

（一）算术运算符

+  -  *  /  %

（二）赋值运算符

=  +=  -=  /=  %=

（三）比较运算符

>  <  >=  <= 
==   对比两边是否相等, 不会区分数据类型
===  对比两边是否相等, 区分数据类型
!=   对比两边是否不相等, 不会区分数据类型
!==  对比两边是否相等, 区分数据类型

新手小白的JS之路