JavaScript复习——02

微波

代码块

写法：

1. {}

复制代码

使用代码块，可以对代码进行分组，同一个代码块中的代码就是同一组代码，一个代码块中的代码，要么都执行，要么都不执行

let 和 var的区别

• 在JS中，let声明的变量具有块级作用域
  
• var声明的变量，不具有块级作用域
  
• var声明的变量会将变量的声明提至最前
  

对象

原始值只能表示一些简单的数据，但是它不方便表示复杂的数据，比如现在要表示一个人的消息
对象就是JS中的一个复合数据类型，它相当于一个容器，在对象中可以存储各种不同的数据类型

对象的操作

注意：

• 当你取删除对象中一个没有的属性时，或者取取对象中一个没有的属性，获得的值时undefined
  

创建对象

1. let obj = new Object();

复制代码

1. let obj = object();

复制代码

1. let obj = {};

复制代码

往对象添加属性

1. let obj = new Object();
2. obj.name = '小红';
3. obj.age = 18;

复制代码

获取对象中的属性

1. let obj = new Object();
2. obj.name = '小红';
3. obj.age = 18;// 对象名.属性名console.log(obj.name);// 对象名['属性名']console.log(obj['name']);

复制代码

修改属性

1. let obj = new Object();
2. obj.age = 18;
3. obj.age = 20;
4. console.log(obj.age);

复制代码

删除属性

1. let obj = new Object();
2. obj.name = '小红';
3. obj.age = 18;delete obj.name;

复制代码

检查对象中是否有对应的属性

1. 属性名 in 对象

复制代码

枚举对象中的属性

枚举对象中的属性：指的是对象中所有的属性全部获取
注意:

• 并不是所有的属性都可以枚举，比如使用符号（Symbol）添加的属性
  

1. let obj = {
2.     name:'孙悟空',
3.     age:18,
4.     gender:'男',
5.     address:'花果山',
6.     [Symbol()]:'测试的属性' // 符号添加的属性是不可枚举的
7. }
9. for(let propName in obj) {
10.     // 获取到对象中所有的属性名和属性值
11.     console.log(propName,obj[propName])
12. }

复制代码

可变类型


不可变类型

我们创建的原始值是不可变类型，我们只能通过修改变量中的地址指向，来指向不同的原始值来改变变量的内容，但是原来地址的内容，我们是变不了的

1. let a = 10
2. let b = 10

复制代码

可变类型

我们的对象就是一种可变类型

• 对象创建完毕之后，我们可以任意的添加和删除对象中的属性
  
• 如果有两个对象指向同一个对象，通过一个变量修改对象时，另外一个变量也会产生影响
  
• 两个对象进行比较的时候，比较的其实是对象的内存地址
  

注意：

• 修改对象时，如果有其它变量指向该对象，那么所有指向该对象的变量都会受到影响
  
• 在使用变量存储的时候，很容易因为改变变量指向的对象，提高代码的复杂度，所以在通常情况下，声明存储对象的变量时，我们一般使用const
  

方法

方法是对象中函数，函数也可以作为对象属性，当对象的一个属性指向一个函数的时候，我们称该函数为对象的方法

1. let obj = {}
2. obj.name = 'jack'
3. obj.age = 18;
5. obj.sayHello = function() {
6.     alert('hello')
7. }
9. obj.sayHello()

复制代码

内建对象

在JS中不仅仅有我们自己创建的对象，还有JS为我们创建的一些对象，这些对象我们称之为内建对象

解构赋值


数组的解构赋值

我们正常的赋值是：

1. const arr = ['小米','华为','苹果']
2. let a,b,c
3. a = arr[0]
4. b = arr[1]
5. c = arr[2]
6. console.log(a,b,c)

复制代码

数组解构赋值:

1. const arr = ['小米','华为','苹果']
2. let a,b,c
3. [a,b,c] = arr // 数组的解构赋值
4. console.log(a,b,c)

复制代码

解构赋值的用法

• 我们解构数组的时，我们可以使用...（展开运算符）来获取我们多余的元素，类似我们的可变参数，它会收集多余的数据存放到一个数组中
  

1. // 这里 p 并不是没有赋值，而是赋值了undefined
2. let [e,f,g,p] = ['小明','小红','小白']
4. // h 的默认值是 10，如果你没有赋值就是undefined 如果你赋值了就是赋的值
5. let [m,n,h=10] = [1,2]
7. // 5,6,8,9这四个数据会放到u中
8. let [o,i,...u] =[1,2,5,6,8,9]
10. console.log(e,f,g,p)

复制代码

• 交换两个元素的位置
  

1. const arr = [1,2,5,3,6,4]
2. // 这里需要在[]之前加一个 ; 因为浏览器不知道代码的尾部
3. ;[arr[0],arr[1]] = [arr[1],arr[0]]

复制代码

• 二维数组解构
  

1. const arr = [[1,2,3],[4,5,6]]
2. console.log(arr[0][1])
4. const arr1 = [['孙悟空',18，'男'],['猪八戒',15,'男']]
6. // 获取到 孙悟空 18 男
7. let [[name,age,gender]] = arr1
8. console.log(name,age,gender)

复制代码

对象的解构赋值

• 声明变量并解构对象
  

1. const obj = {name:'孙悟空',age:18,gender:'男'}
2. let {name,age,gender} = obj
3. console.log(name,age,gender)

复制代码

• 先声明变量在解构对象
  

1. const obj = {name:'孙悟空',age:18,gender:'男'}
2. let name,age,gender
3. // 不加括号会报错
4. ({name,age,gender} = obj)

复制代码

• 自己定义变量名来解构
  

1. const obj = {name:'孙悟空',age:18,gender:'男'}
2. // 给name起别名为 a，给age起别名b 并且给默认值18
3. let {name:a = 'address',age:b=18} = obj

复制代码

注意:

• 如果你没有自己定义变量名来解构，同时你的变量名在对象属性中也没有，你解构就会得到一个undefined的变量
  

对象的序列化

JS中的对象使用时都是存储在我们计算机的内存中
序列化：将我们的对象转换为一个可以存储的格式，在JS中，我们的序列化一般是将对象转换为字符串
序列化的作用：可以在不同使得JS对象在不同的语言中进行传递

序列化操作与反序列化操作

JS对象 ——> JSON字符串

1. const obj = {
2.     name:'孙悟空',
3.     age:18
4. }
6. // 将对象变为JSON字符串
7. const str = JSON.stringify(obj)
9. console.log(obj)
10. console.log(str)

复制代码

JSON字符串 ——> JS对象

1. const obj = {
2.     name:'孙悟空',
3.     age:18
4. }
6. // 将对象变为JSON字符串
7. const str = JSON.stringify(obj)
8. // 将JSON字符串转化为obj2
9. let obj2 = JSON.parse(str)
11. console.log(obj2)
12. console.log(obj)
13. // false
14. console.log(obj === obj2)

复制代码

我们发现通过序列化之后，我们获得到的对象，属性和属性值都相同，但是进行比较发现是false，也就是它们对象的地址不同，我们可以通过这种操作Copy出一个对象，而且是深拷贝

Map

map用来存储键值对结构的数据（key-value）
Object中存储的数据我们也可以认为是一对键值对，属性名-属性值

Map与Object的区别

• Object中属性名只能是字符串或符号，如果传递一个非字符串的数据，解析器会将其自动转换为字符串
  
• Map中任何类型的值都可以作为数据的key
  

1. const obj2 = {}
2. const obj = {
3.     "name":"孙悟空",
4.     "age":18,
5.     [Symbol()]:'哈哈',
6.     [obj2]:'hello'
7. }

复制代码

Map对象的操作

• 创建一个Map对象
  

1. const map = new Map()

复制代码

• 向Map中添加一个键值对
  

1. const obj2 = {}
2. map.set('name','孙悟空')
3. map.set(obj,'呵呵')
4. map.set(NaN,123)
6. console.log(map)

复制代码

• 获取Map中的数据
  

1. let num = map.get(NaN)
2. let str = map.get(obj2)

复制代码

• 删除指定的数据
  

1. map.delete(key)

复制代码

• 检查Map是否存在对应的键
  

1. map.has(key)

复制代码

• 清空Map中所有的键值对
  

1. map.clear()

复制代码

7.Map与数组的转化

1. const map = new Map()
2. map.set('name','孙悟空')
3. map.set('age',18)
5. // 将map转换为数组
6. // [["name",”孙悟空],["age",18]]
7. const arr = Array.from(map)
8. const arr2 = [...map]

复制代码

8.数组转换为Map

1. // 将二维数组转换为Map
2. const map2 = bew Map([["name","猪八戒"],["age",18],[{},()=>{}]])

复制代码

• 遍历Map
  

1. const map = new Map()
2. map.set('name','孙悟空')
3. map.set('age',18)
4. // 这里会将map解开变为一个二维数组，然后再遍历
5. for(const entry of map) {
6.     const [key,value] = entry
7.     console.log(key,value)
8. }
10. map.forEach((key,value)=>{
11.     console.log(key,value)
12. })

复制代码

• 获取Map中所有的key和value
  

1. const map = new Map()
2. map.set('name','孙悟空')
3. map.set('age',18)
5. const keys = map.keys()
6. const values = map.values()

复制代码

Set

set用来创建一个集合
特点：

• set不能存储重复的数据
  
• set的本质就是一个key-value相同的Map
  

Set的操作

• 向Set中添加数据
  

1. const set = new Set
2. set.add(10)
3. set.add('孙悟空')
4. console.log(set)

复制代码

• 判断Set中是否有对应的数据
  

1. const set = new Set
2. set.add(10)
3. set.add('孙悟空')
4. console.log(set.has('孙悟空'))

复制代码

• Set转化为数组
  

1. const set = new Set
2. set.add(10)
3. set.add('孙悟空')
4. const arr = [...set]
5. console.log(arr)

复制代码

• 数组转换为Set
  

1. const arr = [1,2,3,5,3,6,3,5,6,8,1,2,3]
2. const set = new Set(arr)
3. arr = [...set]
4. console.log(arr)

复制代码

• 获取Set中元素的个数
  

1. const set = new Set
2. set.add(10)
3. set.add('孙悟空')
4. console.log(set.size)

复制代码

• 删除Set中的元素
  

1. const set = new Set
2. set.add(10)
3. set.add('孙悟空')
4. console.log(set.delete(10))

复制代码

• 查看Set中的键值对
  

1. const set = new Set
2. set.add(10)
3. set.add('孙悟空')
4. console.log(set.entrys())

复制代码

Date

在JS中所有和时间相关的数据都用Date对象来表示
注意：

• 当我们直接通过 new Date()创建时间的时候，创建的是当前的时间
  

1. let d = new Date()
2. console.log(d)

复制代码

• 可以直接向Date()构造中传递一个表示时间的字符串
  格式：
  

1. yyyy-mm-ddThh:MM:ss

复制代码

1. mm/dd/yyyy hh:MM:ss

复制代码

1. let d = new Date('2023-05-16T23:12:05');

复制代码

方法

• getFullYear()：获取一个4位的年份
  
• getMonth()：获取月份的索引（0 - 11）
  
• getDate()：获取日期（几号）
  
• getDay()：获取当前日期是周几（0是周日）
  
• getTime()：获取当前日期对象的时间戳
  
  
  • 时间戳指的是：自1970年1月1日0时0分到当前的时间所经历的毫秒数
    
  
  
• Date.now()：直接获取当前最新的时时间戳
  

• 创建指定日期的对象
  

1. // new Date(年,月,日,时,分,秒)
2. // 2016年,1月1日 13点 45分 33秒
3. let d = new Date(2016,0,1,13,45,33)

复制代码

• 根据时间戳创建时间对象
  

1. let d = new Date(161561561)

复制代码

日期格式化

• toLocaleDateString：将我们的日志转换为本地的字符串（也就是将日期转换为代码运行环境的字符串）
  

1. const d = new Date()
2. let result = d.toLocaleDateString(d)
3. // 2023/6/1
4. console.log(d)

复制代码

• toLocaleTimeString：将日期的时间转换为本地字符串
  

1. const d = new Date()
2. let result = d.toLocaleTimeString(d)
3. // 8:49:02
4. console.log(d)

复制代码

• toLocaleString：将日期转换为本地时间格式的字符串（包括日期和时间）
  参数：
  
  
  • 描述语言和国家信息的字符串
    
    
    • zh-CN:中文中国
      
    • en-US:英文美国
      
    
    
  • 需要一个对象作为参数，对象中可以通过对象的属性来对日期的格式进行配置，对象有写数学
    
    
    • dateStyle: 指定的日期的风格
      
    • TimeStyle：指定的是时间的风格
      
      
      • full
        
      • long
        
      • medium
        
      • short
        
      
      
    • weekDay：星期的表示方式
      
      
      • long
        
      • short
        
      • narrow
        
      
      
    • year：年份的显示方式
      
      
      • numeric
        
      • 2-digit
        
      
      
    
    
  
  

1. /*
2.     hour12:是否采用12小时制
3.     weekday:日期的显示方式
4. */
5. {dateStyle:'full',TimeStyle:'full',hour12:true}

复制代码

1. const d = new Date()
2. let result = d.toLocaleTimeString(d)
3. // 2023/6/1 8:49:02
4. console.log(d)

复制代码

来源:https://www.cnblogs.com/trueasureyuki/p/17795455.html
免责声明：由于采集信息均来自互联网，如果侵犯了您的权益，请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容，谢谢合作！