十、javaScript对象

一、对象的定义

object / obj

存储数据方式：属性: 属性值

定义方式：

1、字面量：通过{}来定义一个空对象

var obj = {};

2、构造函数

var obj = new Object();

与数组的区别：

• 数组只能使用索引下标，不能使用字符串下标
• 对象可以使用字符串作为属性（键名），通过操作属性调用属性值

二、对象的基本操作

与数组的操作基本类似，通过属性来操作属性值

对象.属性

• 点语法是特殊规定，可以不加引号

• 点语法不支持数值属性的调用

• 点语法不会解析变量，只会将变量，按照字符串处理

var obj = { name: '张三', age: 18, 100: 100 };
console.log(obj.name); // 张三

对象[属性]

• 对象的属性实际上是字符串形式，必须要加引号

• 数值作为属性时，调用数据加不加引号都行

• 支持变量解析，可以解析变量中存储的数据，作为属性在对象中调用属性值

• 变量写在[]中，一定不要加引号，加了引号就成了字符串了

var obj = { name: '张三', age: 18, 100: 100 };
console.log(obj['name']); // 张三
console.log(obj[name]); // undefined

对象的操作：

• 修改：

  • 与数组的操作类似，是对已有的属性进行赋值

  • 后赋值的数据，会覆盖之前存储的数据

• 新增：

  • 对不存在的属性进行赋值，操作效果就是给对象新增单元

• 删除：

  • delete(对象.属性)：删除对象中的指定属性

  • delete(对象[属性])：删除对象中的指定属性

三、对象的循环

for...in语法支持对象的循环

var obj = { name: '张三', age: 18, sex: '男', addr: '北京', hobby: '吃鸡' };
for (var key in obj) {
  // 点语法不解析变量,执行结果是找key这个属性,结果是undefined
  // []语法解析变量，key是对象的属性，obj[key]获得属性值
  console.log(obj.key, obj[key]);
}

四、对象的应用

1、记录字符出现的次数

• 定义一个空对象

• for...in循环遍历str

• 通过obj[]方法查找对象中是否有该属性（键名）

  • 没有该属性（即为undefined），就新增属性，属性值为1

  • 有该属性（键名），属性值（键值）加1

var str = 'aaaabbbbbcccccdddeeefffgggggg';
var obj = {};

// i存储的是字符串的索引，str[i]是对应的字符
for (var i in str) {
  if (obj[str[i]] === undefined) {
    // 如果调用结果是undefined,证明对象中没有这个键名
    // 新增对象的单元,键名是这个字符,键值是 1
    obj[str[i]] = 1;
  } else {
    // 调用结果不是undefined,证明对象中已经存在这个键名
    // 存储数值数据 +=1 或者 ++
    obj[str[i]]++;
  }
}

2、记录数组中数据出现的次数

var arr = [1,2,3,4,5,1,2,3,4,5,6,1,2,3,4,5,6,7,1,2];

var obj = {};

arr.forEach(function(v){
  if(obj[v] === undefined){
    obj[v] = 1;
  }else{
    obj[v]++;
  }
})

五、内置对象

JavaScript定义好的，可以直接使用的对象

1、Math对象

内置数学/算术对象

math.random()：随机数值

• Math.random() 生成 0-1的小数，可以是0，但永远不会是1

• 生成 a - b 的随机数值，包含 a 并且包含 b

var num = parseInt(Math.random()*(b+1-a) +a);

Math.round()：四舍五入取整

• 没有小数部分，四舍五入取整，保留整数部分

• 不改变变量存储的原始数值数据

var float1 = 123.56789;
float1 = Math.round(float1);
console.log(float1); // 124

Math.floor()：向下取整

• 完全舍弃小数部分

var float2 = 123.999999999;
float2 = Math.floor(float2);
console.log(float2); // 123

Math.cell()：向上取整

• 整数部分加1取整

var float3 = 123.00000000001;
float3 = Math.ceil(float3);
console.log(float3); // 124

Math.pow()：乘方运算/幂运算

// 2的3次方,结果是8
console.log(Math.pow(2, 3))

Math.abs()：绝对值

console.log(Math.abs(-10)); // 10

Math.sqrt()：平方根，只有正数

console.log(Math.sqrt(9)); // 3

Math.PI：圆周率数值

console.log(Math.PI);

2、Date对象

内置时间对象

使用步骤

• 创建时间对象

var d = new Date();
// 获取的时间是本地时间,也就是你当前所在时区的时间
// 中国时间是东八区,世界标准时间 +8小时

使用时间对象

• 获取4位年份

var year = d.getFullYear();

• 获取月份，范围是0-11，实际月份是执行结果+1

var month = d.getMonth() + 1;

• 获取日期

var date = d.getDate();

• 获取星期，范围是 0 - 6

// 0表示星期日，1表示星期一
var week = d.getDay();
// 定义一个数组,来存储执行结果 0-6 对应的星期
var weekArr = ['日', '一', '二', '三', '四', '五', '六'];
week = `星期${weekArr[week]}`;

• 获取小时，24小时格式

var hours = d.getHours();

• 获取分钟

var minutes = d.getMinutes();

• 获取秒

var seconds = d.getSeconds();

设定date

• 字符串方法

// 设定完整的时间, 年份日,时分秒,会自定计算星期
var d = new Date('1982-10-12 8:8:0');
var d = new Date('1982/10/12 8:8:0');
var d = new Date('1982 10 12 8:8:0');
var d = new Date('1982,10,12 8:8:0');

// 只设定年，默认执行 月日,时分秒
var d = new Date('2020');

// 只设定年月，默认执行 日,时分秒
var d = new Date('2020/5');

// 只设定年月日，默认执行 时分秒
var d = new Date('2020/5/6');

// 只设定年月日,小时分钟  默认执行 秒
// 不允许独立设定小时,至少要设定小时分钟
var d = new Date('2020/5/6 8:10');

• 设定多个字符串参数，表示日期时间

// 至少要设定年月  
// 设定月份的数值是 0 - 11 对应 1月 - 12月
var d = new Date(2020,7); // 对应的是2020年8月

// 设定年月日
var d = new Date(2020,6,2);

// 设定年月日，时
var d = new Date(2020,6,2,10);

// 设定年月日，时分
var d = new Date(2020,6,2,10,10); 

// 设定年月日 时,分,秒
// 完整时间
var d = new Date(2020,6,2,10,10,10);

时间戳

• 当前时间到1970年1月1日0时0分0秒的时间差

• JavaScript时间戳的单位是毫秒（1秒=1000毫秒）

// 设定时间对象
var d = new Date();
// 默认获取的时间单位是毫秒，需要转化成秒
var times = Math.floor( d.getTime() / 1000 );

3、定时器

按照指定的时间间隔循环往复执行程序

基本语法

• 按照指定时间间隔来执行匿名函数中定义的程序

• 时间间隔单位是毫秒

• setInterval( function(){ 程序内容 }, 时间间隔 )

var interval = setInterval(function(){
  console.log('按设定时间间隔打印')
}, 1000);

• 默认定时器会一直执行，除非终止定时器
  • 定义定时器时，使用一个变量来存储定时器，存储的内容是一个数值，这个数值表示当前定时器是整个程序中第几个定时器
  • 使用程序来终止定时器
  • clearInterval(存储定时器的变量)

clearInterval(interval);

• 注意：定时器不是一上来就执行，要在设定的时间间隔之后执行，需要立即执行，执行程序设定在定时器外面

定时器的异步执行

• 在JavaScript中，普通程序都是同步执行的，遵循顺序流程、分支流程、循环流程三种流程控制

• 特殊程序是异步执行的（包括定时器、延时器、ajax请求）

• 所有的异步程序，都会在同步程序执行完之后才会执行

• 所有的异步程序会一起开始执行，时间间隔短的先执行，时间间隔长的后执行

4、延时器

根据时间间隔，延迟执行程序，只会执行一次

setTimeout( function(){执行的程序}, 延迟时间 )

延时器的清除

clearTimeout()

六、保留指定位小数

// 数值.toFixed(保留小数位数)
var float = 123.456789;
console.log(float2.toFixed(2));