js 定义变量

定义：变量是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据。（银行卡）

相当于一个容器，内部可以存储任意类型的数据，使用变量时，用的是内部存储的数据。目的是可以方便的获取或者修改内存中的数据。

定义变量

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

变量赋值

初始默认存储的值undefined(未定义)

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

// 变量定义
var a;
// 变量赋值
a = 1;
// 变量定义并赋值
var b = 2;

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

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

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

变量名必须有意义
遵守驼峰命名法(bigBox/big_box)

js 数据类型

/**
         *  1. 简单数据类型 (基本数据类型)
         *      1.1 数字类型(number):   所有的整数,浮点数和特殊值
         *      
         *      1.2 字符串类型(string): 在 JS 中, 只要是引号包裹的内容, 统称为字符串
         *      
         *      1.3 布尔类型(boolean): 表明 对true/错false(真/假)必须是小写字母
         * 
         *      1.4 undefined类型 (undefined): 表明未定义, 通常我们不会给一个变量赋值为 undefined, 因为 变量定义但不赋值就是一个 undefined
         * 
         *      1.5 null类型(null): 本身就是一个数据，表明为 空对象指针 (空), 一般很少使用,创建的对象准备在将来用于保存对象，最好将该变量初始化为 null
         * 
         *  2. 复杂数据类型 (引用数据类型)  
        */

数据类型检测

在 JS 中, 一个变量内部保存的值是可以任意更改的，所以在使用的时候为了防止因为数据类型不对, 导致的错误, 所以需要在使用前检测一下数据的类型。假设要检测的变量名为 box

typeof (box)
typeof box

null 的类型就是 null，但是 typeof 这个方法有一点小问题, 它会将 null 识别为 object 类型

数据类型转换(转数值 / 转字符串 / 转布尔)

转数值

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

借助一个转型函数 Number(数据)
parseInt(数据)
parseFloat(数据)
变量/数据 - 0

 //Number()
     // 1.1 字符串：纯数字字符串转为对应数字，空字符串和空白字符串转为0，非空非纯数字字符串转为NaN
        console.log(Number('10086.11'))
        console.log(Number('10086abc'));
        console.log(Number('!@#%'));
        console.log(Number('你好'));
        console.log(Number('')) //空字符串
        console.log(Number(' ')) //空白字符串
     // 1.2 布尔值：true转为1，false转为0
        console.log(Number(true))
        console.log(Number(false));
     // 1.3 undefined：转为NaN null：转为0
        console.log(Number(undefined))
        console.log(Number(null));

//parseInt  取整
     // 2.1 parseInt 如果传递的是一个数字, 那么会忽略小数点以后的所有内容
        console.log(parseInt(10086.11));
     // 2.2 如果不是数字打头的字符串，会转换为NaN
        console.log(parseInt('ty127887878'));
     //  2.3 字符串中，必须是纯数字字符串或者数字字符开头的字符串，才能转换为正常数字，且只取整数部分
        console.log(parseInt('10067.11dsjkj77')) //只读取前面数据部分且取整
        console.log(parseInt('!!#@!@!'))
        console.log(parseInt('你好'))
        console.log(parseInt(''))
        console.log(parseInt(' ')) 
     //  2.4 其他NaN
        console.log(parseInt(true));
        console.log(parseInt(false));
        console.log(parseInt(undefined));
        console.log(parseInt(null));

        //parseFloat 保留小数点  同上
        console.log(parseFloat(10086.11));
        console.log(parseFloat('ty127887878'));
        console.log(parseFloat('10067.11sjkj77')) //只读取前面数据部分
        console.log(parseFloat('!!#@!@!'))
        console.log(parseFloat('你好'))
        console.log(parseFloat(''))
        console.log(parseFloat(' ')) 
        console.log(parseFloat(true));
        console.log(parseFloat(false));
        console.log(parseFloat(undefined));
        console.log(parseFloat(null));

        //工作中用
        console.log('10067.1' - 0)
        console.log('10067j' - 0)
        console.log(true - 0);
        console.log(false - 0);
        console.log(null - 0);
        console.log('' - 0);
        console.log(' ' - 0);

转字符串

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

 //（变量/数据）.toString()
      console.log(typeof(1.1),typeof(1.1.toString()));
      console.log(typeof(true),typeof(true.toString()));
      console.log(typeof(false),typeof(false.toString()));
      
      // console.log(typeof(undefined),typeof(undefined.toString())); 
      //undefined不能用.toString()
      // console.log(typeof(null),typeof(null.toString()));              
      //null不能用.toString()
      

      //String（变量/数据)
      console.log(typeof(undefined),typeof(String(undefined)));   
      console.log(typeof(null),typeof(String(null)));       
      
      
      //（变量/数据) + '' 
      console.log(typeof(undefined),typeof(undefined + ''));   
      console.log(typeof(null),typeof(null + ''));

转布尔

一般开发的时候不会主动的转换布尔类型,一般是隐式转换, 也就是由 JS 帮我们完成了数据的转换, 一般做判断的时候比较常见

借助一个转型函数 Boolean(变量/数据)
!!变量/数据(一个! 表示得到这个数据取反后的布尔值)
转为false：NaN、0、“”空字符串、null、undefined
转为true：非0 非NaN数字、非空字符串

//利用Boolean(变量/数据)
        console.log((Boolean(0)));
        console.log(Boolean(1.1111));
        console.log(Boolean(-1.1111));
        //Number 非零即真
        console.log(Boolean(NaN));  //false

        console.log((Boolean('')));
        console.log((Boolean(' ')));
        console.log((Boolean('ygug')));
        //String 非空字符串为真

        console.log(Boolean(undefined))
        //Undefined 为假

        console.log((Boolean(null)));
          //Null 为假


        // 利用!!(变量、数据)      !为英文叹号，一个叹号表示数据取反后的布尔值
        console.log(!!0);
        console.log(!!-1.1);
        console.log(!!'');
        console.log(!!' ');
        console.log(!!undefined);
        console.log(!!null)

JS 的运算符

也叫操作符, 是 JS 中发起一个运算的最简单的方式

算数运算符

运算符本身就是给数字类型使用的

//如果 符号的任意一边有字符串类型的, 那么不在计算求和, 而是计算一个拼接
               并且拼接后的值是字符串类型的
        console.log(1 + 1)
        console.log(1 + '1')   

        console.log(true + 1);   //2
        console.log(false + 1);  //1
        console.log(true + '1'); //true1
        console.log(false + '1'); //false1


        //两端有字符串，进行隐士转换，变为number类型
        console.log(2 - 1)
        console.log(2 - '1') 

        console.log(true - 1);       //0
        console.log(false - 1);      //-1
        console.log(true - '1');     //0
        console.log(false - '1');    //-1


        console.log(1 * 3)
        console.log(1 * '3')

        console.log(6 / 3)
        console.log(6 / '3')

        console.log(6 % 4)
        console.log(6 % '4')

        console.log(true - 1);
        console.log(false - 1);
        console.log(true - '1');
        console.log(false - '1');
        console.log(typeof(true + '1'));

赋值运算符

//+=
        var a = 100
        a += 50     //a=a+50
        console.log(a)

        //-=
        var a = 100
        a -= 50      //a=a-50
        console.log(a)

        //*=
        var a = 100
        a *= 50      //a=a*50
        console.log(a)

        ///=
        var a = 100
        a /= 50      //a=a/50
        console.log(a)

        //%=
        var a = 100
        a %= 50      //a=a%50
        console.log(a)

比较运算符

  //输出布尔值
        //大于 >
        console.log(100 > 99);
        console.log('100' > 99);

        //小于 <
        console.log(100 < 99);
        console.log('100' < 99);

        //大于等于 >=
        console.log(100 >= 100);
        console.log('100' >= 100);

        //小于等于 >=
        console.log(100 <= 100);
        console.log('100' <= 100);

        //等于 ==(只比较大小)   ===（比较大小和类型）
        console.log(100 == 100);
        console.log(100 == '100');
        console.log(100 === '100');
        
        //不等于 !=(只比较大小)   !==(比较大小和类型)
        console.log(100 != 100);
        console.log(100 != '100');
        console.log(100 !== '100');

自增自减运算符

作用: 将变量自增1或者自减1

语法: 变量++

  如果 符号 在 变量/数据 前, 先运算自增或者自减, 然后参与周围程序运算

++变量

  如果 符号 在 变量/数据 后, 先参与周围程序运算, 然后自增或者自减

// var num = 1
       // ++ 在前, 先运算
       // console.log(++num)  // 2

       // ++ 在后, 后运算
       // console.log(num++)  // 1
       // console.log(num)     // 2

自减运算符

逻辑运算符

&& 逻辑与逻辑且

逻辑与: 满足条件1 并且满足条件2

语法: 变量1/数据1 && 变量2/数据2 运行规则: 会判断符号左边的变量的值, 转换为布尔值后

如果符号左边布尔值为 true, 那么运行符号右边的代码或者返回符号右边的代码

如果符号左边布尔值为 false, 那么直接运行符号左边的代码或者返回符号左边的代码

            console.log(1 && 0);
            console.log(0 && 1);
            console.log(true && false)
            true && console.log('你好');
            false && console.log('hello')

|| 逻辑或

逻辑或: 满足条件1 或者满足条件2

语法: 变量1/数据1 || 变量2/数据2 运行规则: 会判断符号左边的变量的值, 转换为布尔值后

如果符号左边布尔值为 true, 那么运行符号左边的代码或者返回符号左边的代码

如果符号左边布尔值为 false, 那么直接运行符号右边的代码或者返回符号右边的代码

            console.log(1 || 0);
            console.log(0 || 1);
            console.log(true || false)
            console.log(' ' || 0);
            true || console.log('你好');
            false || console.log('hello')

! 逻辑非

得到数据的取反后的布尔值

JS要点整理-2