今日内容:

js内置对象

js简单数据类型&复杂数据类型

js内置对象

数学对象

属性/方法 使用 备注
PI Math.PI 圆周率
max Math.max(…) 返回最大值
min Math.min(…) 返回最小值
abs Math.abs(num) 绝对值
floor Math.floor(num) 向下取整
ceil Math.ceil(num) 向上取整
round Math.round(num) 四舍五入 Math.round(-1.5)=>-1
random Math.random() 返回[0,1)之间的随机数
  1. //封装 生成min到max之间的随机整数
  2. function rand(min, max) {
  3. return min + parseInt((max - min + 1) * Math.random());
  4. }
  5. console.log(rand(1,5))

日期对象

  1. // 日期对象使用 需要 new Date()
  2. // 1 不传参数得到当前时刻的日期对象
  3. var now = new Date()
  4. console.log(now)
  5. // 2 传两个或两个以上参数 表示 年 月 日 ...对应的日期时间对象
  6. var someDay = new Date(2021,3)
  7. console.log(someDay)
  8. var someDay = new Date(2021,3,10)
  9. console.log(someDay)
  10. // 3 传一个日期格式化字符串,表示对应日期/时刻 的日期对象
  11. var anotherDay = new Date('2021/3/20 10:10:10')
  12. console.log(anotherDay)
  13. // 4 传一个数字型参数,此时该参数被认为是时间戳
  14. var date = new Date(2021) //此处得到的日期对象对应1970/1/1 0:0:2(格林威治时间)

日期对象方法:

方法名 作用 备注
getFullYear() 获取4位年
getMonth() 获取月份 0-11 0表示1月
getDate() 获取日期 1-31
getDay() 获取星期几 0-6 0表示周日
getHours() 获取小时 0-23
getMinutes() 获取分 0-59
getSeconds() 获取秒 0-59
getTime() 获取时间戳 距离格林威治时间1970/1/1 0:0:0 的毫秒数

获取时间戳(某个时刻距离基准时刻的总毫秒数)

  1. var date = new Date()
  2. // 方法1
  3. date.getTime()
  4. // 方法2
  5. date.valueOf()
  6. // 方法3
  7. +date
  8. // 方法4
  9. Date.now() //只能得到当前时刻的时间戳

利用时间戳实现倒计时

  1. function addZero(num) {
  2. return num < 10 ? '0' + num : num;
  3. }
  4. function countDown(futureTime) {
  5. // 计算目标时刻和当前时刻 的 时间差(间隔的秒数)
  6. var now = +new Date();
  7. var future = +new Date(futureTime);
  8. var time = (future - now) / 1000;
  9. // 将间隔的秒数 换算成 天 时 分 秒
  10. var day = parseInt(time / 60 / 60 / 24);
  11. var hour = addZero(parseInt((time / 60 / 60) % 24));
  12. var min = addZero(parseInt((time / 60) % 60));
  13. var sec = addZero(parseInt(time % 60));
  14. // 将天时分秒 拼接字符串 返回
  15. return day + '天' + hour + '时' + min + '分' + sec + '秒';
  16. }
  17. console.log(countDown('2021-3-3 19:40:00'));

数组对象

创建数组

  1. 方法1:
  2. var a = [] // 字面量方式
  3. 方法2:
  4. var a = new Array(4) //构造函数方式,此时得到包含4个空元素的数组
  5. var a = new Array('a') //此时得到包含元素'a'的数组
  6. var a = new Array(1,2) //此时得到包含元素 1,2的数组
  7. var a = new Array([1,2,3]) //此时得到包含1个元素[1,2,3]的二维数组

判断是否为数组

  1. 方法1:利用instanceof操作符 使用格式: 某个数据 instanceof 构造函数
  2. var arr = [],x = 1;
  3. arr instanceof Array //true
  4. x instanceof Array //false
  5. 方法2:利用Array.isArray() 使用格式:Array.isArray(某个数据) IE9及以上支持
  6. Array.isArray(arr) //true
  7. Array.isArray(x) //false

相关方法

方法名 作用 参数/返回值 备注
push 往后追加元素 一个或多个数据 返回 最新数组长度 改变原数组
unshift 从前面添加元素 一个或多个数据 返回 最新数组长度 改变原数组
pop 删除最后一个元素 无参数 返回被删除的元素 同上
shift 删除第一个元素 无参数 返回被删除的元素 同上
reverse 翻转数组 无 返回反转后的新数组 同上
sort 数组排序 无参数时字典排序 function(a,b){return a-b}升序排序,return b-a 降序排序 同上
indexOf 查找元素 参数1:要查找的值 参数2:开始查找的索引 返回索引或-1 不改变
lastIndexOf 从后往前查找
join 将数组元素拼接成字符串 参数:分隔符,无参数时默认用逗号连接,返回 字符串 不改变
toString
splice 删除、添加元素 改变
slice 截取数组中的一段 不改变
concat 拼接两个数组或往数组中追加元素 不改变

一个重要概念-包装类型

为了方便编程时对字符串、数字、bool值更灵活的处理,js提供了对应的包装对象

  • String对象 var strObj = new String(‘xyz’),str=’xyz’;console.log(str.length)
  • Number对象 var numObj = new Number(123) ,num=4;console.log(num.toFixed(2))
  • Boolean对象

字符串对象

重要结论:字符串对象方法均不会改变字符串本身

方法名 作用 参数/返回值 备注
indexOf/lastIndexOf 返回字符对应的索引 参数 字符 返回值:索引 找不到返回-1
charAt 返回索引对应的字符 参数 索引 返回值:对应的字符 str[索引]也能得到
charCodeAt 返回索引对应的字符的ASCII码 参数 索引 返回值:对应的字符的ASCii码
substr 字符串截取 参数 起始位置 截取长度 返回截取的字符串
substring
slice
replace 字符串替换 参数:要替换的旧字符串 新字符串 返回替换后的新字符串 默认只替换一次
split 字符串分割 参数:分隔符 返回 数组

js数据类型

  • 简单数据类型 number string boolean undefined null 数据存放于栈中,直接存放值
  • 复杂数据类型 object 数据存放于堆中,堆地址存放于栈中,获取数据时先找堆地址,再找数据
  1. //简单数据类型 变量赋值为 传值
  2. var a=1;
  3. var b=a;
  4. b=10;
  5. console.log(a,b)//1,10 a b互不干扰
  6. //复杂数据类型 变量赋值 为 传地址
  7. var t = { name: '刘德华' };
  8. var p = t;
  9. p.name = '张学友';
  10. console.log(t.name, p.name); //张学友 张学友 p t互相干扰,因为它们现在指向同一块内存
  11. p = { name: '周润发' };
  12. console.log(p.name,t.name); //张学友 周润发 p t此时不会互相干扰,因为对p整体赋值后,p t 已经不再指向同一块内存