- JS的基础

一、js javascript 的基本特点

1. 是一种脚本语言它依赖于其他程序不能独立运行
2. 弱类型 ：语法要求不严格，数据类型分类相对于其他语言没有这么严格
3. 直译型：直接翻译，在运行过程中逐行被解释

二、js的作用

1. 加强页面的动画效果
2. js接收后端传来的数据
3. js给后端传数据
4. js最早是为了解决表单验证的问题
5. 操作html + css 6.动态渲染数据

三、js的引入方式

1. 内部js

<script> ..... script>

2. 外部js

<script src="路径"> </script>

3. 行内js 写在标签上

四、script标签

1. script标签写在body最后面
2. script具有主动性，先要去找到这个对象，也就是div或者其他标签，然后控制对象行为。而css是被html找

- js的输出方式

在js代码中，如果不输出，也就对页面没有任何操作

一、alert( ); 弹窗显示数据

1. 可以识别空格
2. 数字可以不打引号
3. 字符串必须打引号，单双引号都可以
4. 不分单双引
5. 只能写一个参数 二、document.write(" ");
6. 将内容写进HTML文档中
7. 只有他能识别标签
8. 可以写多个参数 三、console.log( )
9. 写入浏览器的控制台
10. 用户看不到代码，主要用于代码测试，可以有多个参数
11. console.log(66)蓝色为数字
12. console.log("66")黑色为字符
13. console.log(true)蓝色为布尔值 四、document.write与alert的区别
14. alert 弹窗不在文档中，所以不识别标签但可以识别空格。document.write文档写入，可以识别标签 五、浏览器的包含
15. 文档+控制台+弹窗+地址栏 等
16. 只有文档部分能够识别标签 六、js的报错
17. 当js报错后，后面的代码不会被执行
18. 常见bug
19. is not defined 没有被定义
20. is not a function 函数报错 不是一个函数
21. Invalid 不合法的
22. missing 缺失

- 变量

一、常量与变量

1. 变量：会变的量 即存储数据的容器
2. 常量：不会改变的量 二、声明变量的方式

var x ;
x = 1;// 赋值
var x = 1 ;
var x = 1 , y = 2;
=号 是指赋值，把右边的值赋予左边。声明多个变量时，之间用逗号隔开，变量不用加引号，且区分大小写。

三、变量的命名要求

1. 只能是数字 字母 下划线 以及$符号
2. 数字不能开头
3. 不能使用关键字和保留字 四、关键字和保留字
4. 关键字：js中正在使用的，具有特殊意义的单词
5. 保留字：js将来可能会定义成关键字的单词 五、变量命名的规范 /建议
6. 不用拼音
7. 建议使用小驼峰命名法或者组合命名法
8. 命名尽量做到见名知意 六、变量的输出
9. 变量输出时不能加引号，且区分大小写

        var x = 1 , y = 2;
        console.log(x,y);//可以写多个参数
        alert(x);//只能写一个参数
        document.write(x,y)//可以写多个参数

- 数据类型

一、基本数据类型和引用数据类型

二、基本数据类型的种类

1. 数字 number
2. 字符串 string
3. 布尔值 boolean
4. null object 空对象
5. undefined
   三、基本数据类型的判断方法 typeof

        var x = 1;
        console.log(typeof x); // number 数字


        var user_name = "yy";
        console.log(typeof user_name);// string 字符串


        var bool = true;
        console.log(typeof bool); // boolean 布尔值


        var a;
        console.log(typeof a);// undefined


        var b = null;
        console.log(typeof b);//object 空对象

四、数据类型的相互转换

1. 数据类型之间可以相互转换
2. 把其他类型转字符串： var str = String(x) 任何数据转字符串都加"" 引号 五、字符串种类
3. 带字母的字符串 "hehe"
4. 纯数字的字符串 "123"
5. 空字符串，空格字符串 "" " "

    <script>
        // 数字类型转字符串
        var a = 1;
        var str1 = String(a);
        document.write(str1);
        // 布尔型转字符串
        var b = true;
        var str2 = String(b);
        document.write(b);
        // null 转字符串
        var c = null;
        var str3 = String(c);
        document.write(str3);
        // undefined 转字符串
        var d;
        var str4 = String(d);
        document.write(str4);
    </script>

六、把其他类型转数字： var n = Number(x);

    <script>
         // 字符串转数字的三种情况
        //  第一种都是数字 直接转数字
        var e = "111";
        var n1 = Number(e);
        console.log(n1); 
        // 第二种字符串包含非数字， 结果为NaN 
        var e2 = "111bb";
        var n2 = Number(e2);
        console.log(n2); 
        // 第三种，空字符串和空格字符 都转为0
        var e3 = " ";
        var n3 = Number(e3);
        console.log(n3); 
        var e3 = "";
        var n3 = Number(e3);
        console.log(n3); 
        // 布尔类型转数字 true为1 false 0
        var f = true;
        var n4 = Number(f);
        console.log(n4); 
        // undefined 转数字 为NaN
        var g;
        var n5 = Number(g);
        console.log(n5);
        // null转数字 为0
        var h = null;
        var n6 = Number(h);
        console.log(n6)
    </script>

数字类型的种类

1. 纯数字：123
2. 带字母的数字 ：NaN 123q 七、把其他类型转为布尔值 var bool = Boolean();

    <script>
        // 数字类型转布尔  NaN和0 为false ,其他值都是true
        var n7 = 0;
        var bool1 = Boolean(n7);
        console.log(bool1);
        var n8 = NaN;
        var bool2 = Boolean(n8);
        console.log(bool1);
        // 字符串转布尔值 正常字符串都是true ，空格也是true 。字符串里有东西都是true
        var str_1 = "wowowowo";
        var bool3 = Boolean(str_1);
        console.log(bool3);
        // 空字符为 flase
        var str_2 = "";
        var bool4 = Boolean(str_2);
        console.log(bool4);
        //null转为布尔值 为false
        //undefined 转为布尔值 为false
    </script>

- 运算符

一、运算符的种类

1. 算数运算符 + - * / %
2. 比较运算符 >, <, >=, <=,==,===,!= ,!==
3. 逻辑运算符 与&& 或|| 非！
4. 赋值运算符 = ，+= ， -=， *=， /=， %= 二、算数运算符

    <script>
        // +
        var x = 1 , y = 2 ;
        var z = x + y ;
        console.log(z);
        // -
        var x = 1 , y = 2 ;
        var z = x - y ;
        console.log(z);
        // *
        var x = 1 , y = 2 ;
        var z = x * y ;
        console.log(z);
        // /
        var x = 1 , y = 2 ;
        var z = x / y ;
        console.log(z);
        // %
        var x = 1 , y = 2 ;
        var z = x % y ;
        console.log(z);
        // 特殊情况 当除数为0 时，值为Infinity 无穷大
        var s = 1/0;
        console.log(s);
        // 算数运算符只有数字 正常的数字NAN  Infinity


    </script>

三，加号的两个含义

1. 字符串的拼接
2. 数字的求和
3. 遇到字符串就是拼接，没有字符串就是求和 四、算数其他的运算 只有数字可以做减法 乘法 除法 取模

       var x = "23";
        var y = 2;
        console.log(x-y); // 值为21
        var x = "hi"
        var y = 2;
        console.log(x*y)// 值为NaN

五、隐式转换

其他类型转字符串

1. 强制转换 String()

2. 隐式转换 +"" 加引号 其他类型转数字

3. 强转 Number()

4. 隐转 x - 0 , x * 0 , x/0 , x%n n为比他大的数 3.Math.ceil() Math.round Math.floor 4.parseInt() parseFloat()

变量在使用的过程中，是值在做运算，不是变量在做运算

变量只有通过赋值才会改变

六、比较运算符

1. 得到的是布尔值
2. 大于或等于 >= ,小于或等于<= ,等于 == ， 不等于！= ，等等 ===，不等等！== 大于> 小于<
3. 关于等号
4. = 赋值
5. == 判断值相等
6. ===值和数据类型都要相等
7. ！= 值不相等
8. ！== 值不相等或数据类型不相等 七、逻辑运算符
9. 值为布尔值
10. 与 && 多条件同时满足
11. 或|| 只要有一个条件满足就满足||
12. 非 ！ 取反 ！ 短路：能提高效率
13. 在逻辑与运算中，见假及假
14. 在逻辑或运算中，一真必真 八、赋值运算符

• += -= *= /= %=

   <script>

        var x = 1;
        console.log(x+=1);//x = x + 1;
        console.log(x*=1);//x = x * 1;
        console.log(x-=1);//x = x -  1;
        console.log(x/=1);//x = x /  1;
        console.log(x%=1);//x = x % 1;
        
    </script>

九、自增运算

1. ++
2. x++ 先赋值 后x自增
3. ++x 先自增 后赋值

    <script>
        var a = 2;
        var b = a++;
        console.log(b); // 先赋值 a++ = 2
        console.log(a);// 后a 自增 a = 2 + 1
        
        var i = 1;
        var c = ++i;
        console.log(c); // 后赋值 ++i = 2
        console.log(i);// 先i自增 i = 1+1
    </script>