[JS]对象

news2024/11/23 15:10:37

介绍

对象是一种无序的数据集合, 可以详细的描述某个事物

事物的特征在对象中用属性来表示, 事物的行为在对象中用方法来表示

使用

创建对象

let 对象名 = {
    属性名：值，
    方法名：函数，
}

let 对象名 = new Object();
对象名.属性 = 值；
对象名.方法名 = 函数；

对象的属性用来描述对象的信息, 一般是名词性的
属性名可以用引号包裹, 一般情况下省略, 除非名称包含特殊符号( 空格 / 中横线)
对象的方法用来描述对象的行为, 一般是动词性的
方法名可以用引号包裹, 一般情况下省略, 除非名称包含特殊符号( 空格 / 中划线 )

操作对象

访问

对象名.属性名 // 常规访问
对象名["属性名"] // 特殊访问
对象名.方法名();

修改

对象名.属性名 = 新值
对象名.方法名 = 新函数

新增

对象名.新属性名 = 值
对象名.新方法名 = 函数

删除

delete 对象名.属性名 // 严格模式失效

遍历对象

不能像遍历数组一样遍历对象

对象没有像数组一样的length属性,所以无法确定长度
对象里面是无序的键值对, 没有规律. 不像数组里面有规律的下标

for(let k in 对象名) {
  console.log(k)         // 得到属性名(字符串)
  console.log(对象名[k])  // 得到属性值
}

内置对象

JS内部提供的对象, 包含各种属性和方法给开发者调用

Math对象

提供了一系列数据运算的方法

Math.max(); 最大值
Math.min(); 最小值
Math.ceil(); 向上取整
Math.floor; 向下取整
Math.random(); // 生成随机数, 0-1之间, 包含0不包含1, [0-1)
查询更多: https://developer.mozilla.org/zh-CN/

// 生成0-10的随机数
Math.floor(Math.random() * (10 + 1))

// 生成5-10的随机数
Math.floor(Math.random() * (5 + 1)) + 5

// 生成n-m的随机数
Math.floor(Math.random() * (M - N + 1)) + N

// 生成数组随机下标
 Math.floor(Math.random() * arr.length)

Data对象

提供了一些列和时间相关的方法

// 获取系统时间
const date = new Date()

// 获取指定的时间对象
const date = new Date('2022-12-08')

对象方法

日期对象返回的数据不直观, 所以要经常的进行格式转换

<script>
    function getMyDate() {
      const date = new Date();
      let h =  date.getHours();
      let m =  date.getMinutes();
      let s =  date.getSeconds();
      h = h > 10 ? h : '0' + h;
      m = m > 10 ? m : '0' + m;
      s = s > 10 ? s : '0' + s;
      return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()} ${h}:${m}:${s}`
    }

     console.log(getMyDate());
  </script>

<script>
  const date = new Date();
  console.log(date.toLocaleString());   // 2022/1/10 09:15:05 
  console.log(date.toLocaleDateString());  // 2022/1/10
  console.log(date.toLocaleTimeString());  // 09:15:05 
</script>

<script>
  const arr = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六',] 
  arr[new Date().getDay()]
</script>

时间戳

1970年1月1日00时00分00秒起到现在的毫秒数, 是一种计量时间的方式, 用于实现时间的计算

// 方法1
cosnt date = new Date()
date.getTime()

// 方法2 (推荐)
+new Date()
+new Date('2023-12-15 16:00:00')

// 方法3
// 只能获取当前的时间戳
Date.now()

<script>
  // 1.计算剩余时间秒数
  // 剩余时间毫秒数 = 未来的时间戳 - 现在的时间戳
  const surplus = (+new Date('2024-8-12 12:00:00') - +new Date()) / 1000;
  // 2.转换时间格式
  let d = Math.floor(surplus / 60 / 60 / 24); // 剩余天数
  let h = Math.floor(surplus / 60 / 60 % 24); // 剩余小时
  let m = Math.floor(surplus / 60 % 60);      // 剩余分钟
  let s = Math.floor(surplus % 60);           // 剩余秒数
  // 3.拼接剩余时间
  const date = `${d}天${h}小时${m}分钟${s}秒`;
  console.log(date);
</script>