day2

209 阅读12分钟

八种js的数据类型

 1.bigint 大整型  ES6
 2.string 字符型
 3.number 数值型
 4.boolean 布尔型
 5.function 函数型
 6.object 对象型
 7.symbol 唯一型  ES6
 8.undefined 未定义型

1.字符型

  + 字符串 String
      => 一切被引号包裹的内容
      => 就是一段文本而已
      => 只要使用引号包裹即可
        -> 单引号 ''
        -> 双引号 ""  //双引号内的内容要换行加\n 转义字符(不支持回车换行,仅支持转义字符)
        -> 反引号 ``  //单引号 双引号都不能多行输出且只能输出文本(也就是符号里面不能回车) 反引号可以
      => 反引号定义的字符串我们给他起了一个单独的名字(叫做 模板字符串)
        -> 特点1: 可以直接换行书写
        -> 特点2: 可以直接在字符串内解析变量, 当你需要解析变量的时候, 使用 ${ 变量名 }
        -> 特点3:可以解析HTML,让代码加在body内
  如果内容出现相同引号时,需要使用转义""或者转义''
    例:var str7="ab'c\"f\"g'de" 结果为:ab'c"f"g'de

2.数值型

 + 数值 Number
      => 整数
      => 浮点数(小数)
      => 科学记数法 10e5表示105次幂 e-2表示10的负2次幂
      => 其他进制表示的数字
        -> 十六进制: 0x 开头
        -> 八进制: 0o 开头
        -> 二进制: 0b 开头
        
      => NaN(Not a Number) 非数值
        -> 表示是数值类型, 但是 不是一个数字
       例:var n=NaN;
          console.log(typeof n);//number 

3.布尔型

+ 布尔 Boolean
      => 只有两个值
      => true, 表示真, 在计算机内存储的就是就是 1
      => false, 表示假, 在计算机内存储的就是就是 0

4.大整型

bigint 数值会有溢出的情况,数值溢出后加n就可以继续计算了(进行溢出相加)带n
例:console.log(9007199254740992n+1n)

5.函数型

function 函数型(有三种书写方式)  一个包含有多个语句的语句块,执行函数名,就会把这个语句块中的所有语句执行一遍
function fn(){}             //声明式
var fn1=function(){}        //赋值式
var fn2=new Function();

6.对象型

obj 对象型(标志是键值对)  用{}来表示对象 使用key,value这种键值对描述数据
a是键  1是值  键是唯一的,
也就是在对象中这个键名是唯一不能有重复的(重复的值会被覆盖)
每个键名对应一个值
var obj={a:1,b:2};

a=undefind 为什么不行 内存泄漏(如下图)

微信图片_20220531221351.png

7.唯一型

每次创建的Symbol都是唯一的,不可能和别的数据相同,不能用于各种运算
  例:Symbol()=Symbol() 是错的是不相等的
一般用于做对象的键来使用
var b="a"
var s=Symbol();
var obj={
    [b]:1,
    [s]:2
    }   //结果为 a:1 Symbol():2
原因:在对象中使用[变量]就可以把变量的值作为这个键名使用  !!!!!

7.undefind

+ 空 Undefined
      => 只有一个值
      => undefined
      => 表示定义未赋值, 这里本该有一个值, 但是没有, 就是 undefined
      
  定义变量但是没有赋值 这就是未定义值
  var a;
  定义变量,并且赋值为undefined,未定义值
  var a1=undefined;

8.null

+ 空 Null
      => 只有一个值
      => null
      => 表示有值, 有一个空值, 必须要手动赋值为 null, 才是 null
 Note:值  null  空值 属于object类型(对象型) 
      例:var o=null;
         console.log(typeof o);//object

9. undefined 0 null "" 区别

"" 是针对字符型
0  是针对数值型  
undefined  是针对定义变量,但是没有赋值这种情况
null 主要用于将已定义的对象清空引用列表中的当前变量,针对对象的。主要是解除引用关系,可以使对象在没有别的变量调用时被垃圾回收车回收

2.数值类型转换有五种

1.Number();//强制转换为数值
2.String();//强制转换为字符串
3.Boolean();//强制转换为布尔值
4.Object();//强制转化为对象
5.Symbol();//强制转换为唯一值

2.1.转换成数值型

 1. Number()
    => 语法: Number(你要转换的内容)
    => 返回值(结果): 转换好的数值类型
    => 转换规则:
      -> 把你要转换的内容当做一个整体
      -> 如果可以转换成合法数字, 那么得到的就是一个数字
      -> 如果不能转换成合法数字, 那么就是 NaN
    => 转换布尔:
      -> 会把 布尔类型 true 转换成数字 1
      -> 会把 布尔类型 false 转换成数字 0
      
1.字符串强制转换为数值时,如果有非数字存在,则转换后是NaN
  var  a="3a"; //NaN
2.如果纯数值字符,转换后是数值
3.如果是空字符串,转换后是0
4.如果是布尔值 true转换数值为1  false转换数值为0
5.undefined 强制转换数值为NaN
  a=undefined //NaN
6.null 强制转换为数值为0
  a=null; //0
7.对象强制转换为数值为NaN
  a={a:1}; //NaN
8.数组强制转换为数值,首先会自动转换为字符串,然后再转换为数值
      []  转换为字符串是 ""  --> 0
    a=[];   //0
      [3] 转换为字符串是 "3" --->3
    a=[3];  //3
      [1,2,3] 转换为字符串是 "1,2,3" -->NaN
    a=[1,2,3];  //NaN
9.报错,任何Symbol不能转换为数值
 a=Symbol();
 console.log(Number(a));

2.2转换成字符串

  1. String()
    + 语法: String(你要转换的内容)
    + 返回值(结果): 转换好的字符串类型
    + 什么数据都可以转换

  2. toString()
    + 语法: 你要转换的内容 (变量).toString()
    + 返回值(结果): 转换好的字符串类型
    + 注意: undefined 和 null 不能用

  3. 字符串拼接
    + 使用 加号(+) 进行字符串拼接
    + 加号(+) 的意义
      => 含义1: 字符串拼接
        -> 当运算符任意一边是字符串的时候, 不会进行数学运算, 而是直接拼接在一起
      => 含义2: 数学运算
        -> 当运算符两边都是数字或者布尔的时候, 会直接进行数学运算
2.2.1转字符串的补充(记)
1.所有的对象( obj={} )转换为字符串后都会变成"[object Object]"
  a={}; // "[object Object]";
  a={a:1,b:2};// "[object Object]";
  a={a:10,b:20};// "[object Object]";
  
2.空数组转换成字符串是空字符串
  a=[];//""
  a=[1];//"1"
  a=[1,2,3];//"1,2,3"
  
3.JSON 是一组方法,可以将对象转换为JSON格式的字符串,也可以将JSON格式的字符串转换为对象
 '{"a":10,"b":20}' 这种就是JSON格式的字符串,特征是所有的属性名都必须使用""引起来
 总结:JSON是对象和字符串相互转换的一种字符串格式
 
例子:var a=4; //"4"
    a=056;//"46"   这是8进制,所以会自动将八进制转换为10进制数值46,然后转换为字符串
    a=0xFF;//"255"  这是16进制,会自动转换为10进制255,然后转换字符串
    a=3.2e2;//"320"
    a=true;//"true";
    a=false;// "false"
    a=undefined ;//"undefined"
    a=null;//"null"
    a=Symbol();//"Symbol()"

2.3转换成布尔值

1. Boolean()
    => 语法: Boolean(要转换的变量)
    => 返回值(结果): 转换好的布尔类型
    => 在 JS 内, 转换布尔的结果只有两个, true 或者 false
      -> 只有六个内容转换是 false
      -> 数值 0
      -> 数值 NaN
      -> 空字符串 ''
      -> undefined
      -> null
      -> false

2.4数值 字符型 布尔型都有两种类型(以后再看)

 分为字面量值和对象值
  1.字面量值
   Number{1}  对象值
   字面量值被存储在栈中 就是一个值但是有时候我们需要对于这种值使用方法
    var str="ab";
    str.indexOf("a") indexOf是字符串的一个方法,查找a这个字符在字符串str中第几位
  2.所有的对象使用这个对象的方法或者属性时才使用. 
   window.alert() window对象下的方法
   console.log()  console是一个对象,这个对象下的方法log
   str.indexOf("a") 按照这个规则 str就应该是一个对象,但是实际str并不是对象,而是字符串
  按理来说是不能使用.语法,但是实际js为了能够让字符串、数值、布尔值可以使用.语法。就创建了一个对应的对象类型 
    string -->String  number-->Number  boolean-->Boolean
  这时候就可以使用映射的方法,将栈中的string调用String对象的方法集
  万物皆对象

2.5转换成对象 Object{} (记)

var a=1;//Number {1}
a="a";//String {'a'}
a=true;//Boolean {true}
a=undefined;//{}
a=null;//{}
a=Symbol();//Symbol
a=[]//数组本身就是对象,所以不改变

2.6转Symbol

var a="s";//Symbol(s)
a=1;//Symbol(1)
a=true;//Symbol(true)
a={a:1};//Symbol([object Object])  会把对象先转换为字符串然后再放在Symbol
a=[];//Symbol()
a=[1];//Symbol(1)

2.7特殊方法转换

var a=5;
console.log(a.toString());
console.log(5.toString());   //这里会报错
原因:任何调用方法的元素,必须遵从于变量命名规则,即第一个符号不能是数值。所有数值调用方法时都必须使用变量来做处理
1.toString(进制)  可以将数值转换为对应的进制字符串 2-36(不能超出范围)
2.toFixed(n)  保留n位小数,自动四舍五入

2.8将字符串转换成对象

1.parseInt()  //向下取整的方法
2.parseFloat()  //将字符串转换为浮点数
3.parseInt(字符串,进制)   //就是该字符串当做什么进制来转换成十进制!!默认进制是十进制
按照后边进制指出字符串是该进制方式转换为数值按照对应进制转换
 例:console.log(parseInt("3a")); //结果:3
    原因:省略了进制。默认进制为10

3.运算符分为六种

1.数学运算符
2.赋值运算符
3.比较运算符  
4.逻辑运算符
5.位运算符
6.自增自减运算符
所有运算符都是有返回值的,包括=赋值

3.1数学运算符

 1. +
      => 含义1: 字符串拼接(引号内的内容), 运算符任意一边是字符串的时候, 会进行字符串拼接
      => 含义2: 数学运算, 只有运算符两边都是数字或者布尔的时候
 2. -
 3. *
 4. /
 5. % 取余(摩)
   => 取得两个数字的余数
   => 小学数学: 被除数 / 除数 = 商 ...... 余数
   => 就是最后不够整除的那一部分
 6. ** 取幂
   => 底数 ** 指数
   => 谁 ** 的多少次方

3.2赋值运算符

1. =
   => 赋值, 把右边的内容给到左边的变量, 优先级最低(重要)
例:console.log(a=3=2);//错误提示Invalid left-hand side in assignment
例:arr[1]=arr[0]=arr=5;//arr[0]=5;arr=5; 没有先后顺序的,是同时的。同时处理值,最后做赋值
百度的面试题
 var obj={a:1,b:2};
 var obj1=obj;
 obj.a=obj={a:10};
 console.log(obj1);  //结果{a:{a:10},b:2} 
2. +=
  => 加号 和 赋值符号 的合作
  => 示例: x += 10
          x = x + 10
3. -=
4. *=
5. /=
6. %=
  => 用余数代替自己
  => 实例: x %= 3
          x = x % 3

3.3比较运算符

1. >
2. <
3. >=
4. <=
5. == 等于
  => 比较两边的值是否相等, 不考虑数据类型
  例:"" false 0  相等
    console.log(""==false);//true
    console.log(false==0) ;//true
    console.log(""==0);//true
    
    console.log(undefined==null);//true
    
    不管是undefined 还是null,都不等于 "" false 0
    console.log(undefined==false);//false
    console.log(null==0);//false
    console.log(""==null)//false
    console.log([]==false);//true   ""==false  原因:[]会转换成""
    console.log([]=="");//true
    console.log([]==null);//false
    console.log([]==0);//true;  ""==0
    console.log([]==[]);//false  //比较引用地址
6. === 全等于
  => 比较两边值和数据类型都相等
7. != 不等
  => 比较两边的值是否不等于, 不考虑数据类型
8. !== 不等等
  => 比较两边的值是否不全等
所有关系运算符返回布尔值  

3.4逻辑运算符

1. && 与(且)
  => 运算符两边都是 true 的时候, 得到 true
  => 有任意一边是 false 的时候, 得到 false
  => 同真为真, 一假则假
2. || 或
  => 运算符两边任意一边是 true 的时候, 得到 true
  => 只有两边都是 false 的时候, 得到 false
  => 一真为真, 同假则假
3. !  非
  => 取反
  => 本身是 true, 结果就是 false
  => 本身是 false, 结果就是 true

3.5位运算符

 位运算符
    + 把内容转换成二进制位来进行运算
    + 把数字转换成 二进制 进行运算
  1. & 与
    => 同真为真, 一假则假
  2. | 或
    => 一真为真, 同假则假
  3. ~ 非
    => 取反
  4. ^ 异或
    => 一样是 0, 不一样是 1
  5. << 左位移
    => 把整体向左移动x位
  6. >> 右位移
    => 把整体向右移动x位

3.6自增自减运算符

  自增自减运算符(一元运算符)
    1. ++  让自身 +1
    2. --  让自身 -1
  以 ++ 为例
    + 书写:
      => 前置++:  ++变量
      => 后置++:  变量++
    + 共同点: 都会改变变量自身的值
    + 区别: 在于参与运算的时候
      => 前置++: 先把变量的值改变(+1), 用改变后的值参与运算
      => 后置++: 先把变量本身的值参与运算, 然后在改变变量的值(+1)
  以 -- 为例
    + 书写:
      => 前置--:  --变量
      => 后置--:  变量--
    + 共同点: 都会改变变量自身的值
    + 区别: 在于参与运算的时候
      => 前置--: 先把变量的值改变(-1), 用改变后的值参与运算
      => 后置--: 先把变量本身的值参与运算, 然后在改变变量的值(-1)

3.7其他例子

1.所有的条件语句,表达式都会转换为布尔值  (隐式转换 ,隐式转换通常使用强制转换方法)
例 var a;
if(a=3){ //a=3  返回了3   隐式转换为布尔值  3转换布尔值时就是true
  a=5;
  }
  console.log(a);  //5
  
 2. +运算时,如果运算两端中有字符串或者数组、对象,都会优先将另一侧隐式转换为字符串,再首尾相接
例 console.log("a"+undefined);"aundefined"
   console.log("3"+null);//"3null"
   console.log([]+null);//"null"
   console.log([1]+2);//12
   console.log([1,2]+0);//1,20
   console.log(3+{}+(2+3));//3[object Object]5

   var o={a:1};  //"[object Object]"
   console.log(o+0) //[object Object]0
   
   var o={a:1};
   var o2={a:2};
   console.log(o+o2);//[object Object][object Object]
   
3. - * / % **  全部隐式转换为数值运算
    %  取余数 
 例:console.log(3*[]); //[]-->""-->0
    console.log("5a"-5);//NaN
 
4. js中所有的数学运算都会转换为二进制,二进制在处理小数问题上会有问题
 只要是带有小数点不确定性值发生问题  - * / % 
 例:console.log(2-1.1>=0.9)//false
    console.log(2-1.1<0.9)//true
5.比较
  例:console.log([]==[]);//false  //比较引用地址
    console.log([]==![]);//true   []==false   ""==false
  ![] 取反优先级高    ![]将布尔值转换反向  (true--->false)   Boolean([]) -->true   !true--->false
  ![]--->false
   []==false   ""==false  --> true      !!!!!!!!
  console.log(null+[]==![]);//false   "null"==false  
  console.log([]-0==![]);//true
  console.log({a:1}=={a:2});//false
  console.log({a:1}+""=={a:2});//true  "[object Object]"=={a:1}   "[object Object]"=="[object Object]"
6.任何东西不能和NaN做比较
  例:console.log(Number(a)==NaN);//false

Number.isNaN()和isNaN()的区别

1.通过window.isNaN  会自动隐式转换为数值,然后判断是否是NaN
2.通过Number.isNaN 判断  不会自动隐式转换为数值 直接判断是否是NaN