JS 8 种 数据类型总结

最新的 ECMAScript 标准定义了 8 种数据类型

基本数据类型	引用数据类型
Boolean，null，undefined，Number，String，BigInt，Symbol	Object 对象

• 七种基本数据类型：

  • Boolean：true和false

  • null

  • undefined：表示变量未赋值时的属性。

  • Number：整数或浮点数，例如： 42 或者 3.14159。

  • BigInt：任意精度的整数，可以安全地存储和操作大整数，甚至可以超过数字的安全整数限制

  • String："Howdy"

  • Symbol：代表；一种实例是唯一且不可改变的数据类型

• 引用数据类型： Object 对象

数据类型的转换：

1. 数字 > 字符串：

   • 使用加法运算符（+）

     y = 42 + " is the answer"; // "42 is the answer"

   • toString()、toString(radix) 2~36

   const count = 10;
   console.log(count.toString()); // "10"
   const x = 6;
   console.log(x.toString(2)); // "110"

2. 字符串 > 数字： var b = '899.90086a'

   • Number(b) //NaN

   • parseInt(b) //899

   • parseFloat(b) //899.90086

3. isNaN

   var a = 10
   console.log(isNaN(a)) //false
   var str = 'abc'
   console.log(isNaN(Number(str)))//true

4. 无穷大 无穷小

   //无穷大
   var max = Infinity
   //无穷小
   var min = -Infinity

5. 字符串 > 布尔类型
    

   var str = "abc"
   //转为boolean类型 非空就是true 空字符串表示false
   var b = Boolean(str) //true
   var b1 = Boolean('') //false

6. number > 布尔类型

   var number1 = 10//
   number转布尔 非0和非NaN则为true   NaN和0就是false
   console.log(Boolean(number1))//true
   console.log(Boolean(0))//false
   console.log(Boolean(NaN))//false

7. undefined 和 null > 布尔类型

   var un
   console.log(Boolean(un)) //false
   console.log(Boolean(null)) //false

8. boolean > number

   console.log(Number(true)) //1
   console.log(Number(false)) //0

9. undefined 和 null > number

   var un
   console.log(Number(un)) //NaN
   console.log(Number(null)) //0

• 对象

对象属于一种复合的数据类型，在对象中可以保存多个不同数据类型的属性。

1. 内建对象 ES标准中定义的对象 - Math String Number Function Object...

2. 宿主对象 由浏览器提供的对象 - 比如BOM DOM （console document）

3. 自定义对象 由开发人员自己创建的对象 let obj = { age: 18 }

• 函数

  • 创建函数：let fun = new Function()

  • 调用函数：fun();|

  • 返回值：return

  • 全局作用域：全局对象window，在页面的任意位置都可以访问到。

  • 函数作用域：在函数作用域中操作一个变量时，会现在自身作用域中寻找，如有，直接使用，若无，到上一级寻找。若依旧未找到，则报错ReferenceError。

• 运算符

  • 自增 a++ 、++a、a--、--a

  • 一元运算符

    • delete 删除对象的属性

    • void 表示表达式放弃返回值

    • typeof 判断给定对象的类型

    • +：一元加运算符将操作转换为 Number 类型

    • -：一元减运算符将操作转换为 Number 类型并取反

    • ~ ：按位非运算符

    • ！：逻辑非运算符

  • 算术运算符

    • +：加法运算符。

    • -：减法运算符。

    • /：除法运算符。

    • *：乘法运算符。

    • %：取模运算符。

    • **：求幂运算符。

  • 比较运算符

    • in 运算符用来判断对象是否拥有给定属性

    • instanceof 运算符判断一个对象是否是另一个对象的实例。

    • <（小于）>（大于）

    • <=小于等于运算符。>=小于等于运算符

    • == 相等 != 不等 ===全等 !==非全等

  • 逻辑运算符

    • && 逻辑与

    • || 逻辑或

    • 空值合并运算符 如果 ?? 前面是null或 undefined，取后面的默认值

  • 三元表达式 (condition ? ifTrue : ifFalse)

  • 赋值运算符

    • =

    • [a, b\] = arr, { a, b } = obj

      解构赋值允许你使用类似于数组或对象字面量的语法将数组或对象的属性赋值给变量。

• trim方法去除两侧空格

  let a = ' apple ' //a.length = 9
  let b = a.trim() //b.length = 5

• 模板字符串

  1. 创建字符串

     let name = `Lucy学习笔记`;

  2. 可以解析变量

     let name = 'Lucy';
     let say = `hello, my name is ${name}`;//hello,my name is Lucy

  3. 可以换行

     let html = `<div>
         <span><span>
         <span><span>
         <span><span>
     </div>`;

  4. 可以调用函数

     const say = function(){
         return 'hahaha';
     }
     let greet = `${say()}`; //hahaha

String 的扩展方法

• startWith(): 是否以某字符串开头；返回布尔值

• endWith(): 是否以某字符串结尾；返回布尔值

  let str = 'Hello world!';
  str.startWith('Hello');//true
  str.endWith('?');//false

对象的属性添加或修改

1. 旧方法

   var obj = {
       id:1,
       name:'小米'
   }
   obj.price = 999;

2. Object.defineProperty()

   Object.defineProperty(obj,'num',{
       value:1000,
       enumerable:true,//如为false则不允许遍历
       configurable:false//不允许删除这个属性 不允许再修改第三个参数里面的特性
   })
   ​
   //不允许修改属性值
   Object.defineProperty(obj,'id',{
       writable:false,//值是否可以修改 默认为false不能修改
   })
   obj.id = 2;
   console.log(obj);//id还是为1

3. Object.keys()获取对象自身的所有属性 返回一个由数组名组成的数组

   var arr = Object.keys(obj);
   delete obj.num;//num没被删 configurable:false//不允许删除

4. 1.修改num值，obj不会随着改变
   

   let num = 18;
       var obj = {
       id:1,
       name:'小米',
       age:num,
   }
   console.log(obj.age)

   2.通过Object.defineProperty中的getter,每次读取age都调用一次
       所以当我们修改了num，再读取obj.age时get()就会调用
   

   let num = 18;
       var obj = {
       id:1,
       name:'小米',
   }
   Object.defineProperty(obj,'age',
   {   
       // value:13,
       // enumerable:true,
       // writable:true,
       // 当age属性被读取时调用,返回值为age的值
       get(){
           console.log('有人读取');
           return num
       },
       //当age属性被修改时调用,返回被修改的值
       set(val){
           console.log('有人修改');
           num = val
       }
   })
   // num = 19;
   console.log(obj)