4_js函数的进阶与常用对象的使用

day04_js函数的进阶与常用对象的使用

1. 作用域

作用域：指的就是变量的有效范围

2. 什么是作用域链

作用域链：在访问变量的时候是按照就近原则

3. 简单的理解类和对象

3.1 对象的相关概念

从用户登录的角度理解为什么需要对象
我们为什么要使用对象
- 1.封装数据
- 2.传递数据
- 3.可以把一些通用的操作封装到对象中去。
- .......

3.2 创建对象的三种方式

方式一：

var userZS = {//  左边表示对象的属性，右边表示对象的值name: "张三",gender: "男",birthyear: 19920918,addr: "老虎坡",isMarried:"否",salary: function() {return 15000;}
}

// 如果是通过对象封装的数据，可以直接通过.属性获取。
console.log(userZS.name);
console.log(userZS.isMarried);
//对象中还可以封装函数。
console.log(userZS.salary());
//总结：对象的功能是非常强大的。

方式二：
- 利用new关键字创建对象：var zs = new Obect();
扩展方式三：
- 需求：我们要创建多个同类型的用户怎么实现呢？
- 构造函数：就是用来构造（初始化）对象的。
  - this：谁调用有this的函数，那么this就代表谁。
    - zs.salary(15000) //this == 张三
    - lisi.salary(16000) // this == 李四
    - wangwu.salary(17000) // this == 王五

3.3 对象的遍历

课堂案例：06.遍历对象的属性和方法.html

for (var k in obj) {console.log(k);      // 这里的 k 是属性名console.log(obj[k]); // 这里的 obj[k] 是属性值
}

4. JS的常用内置对象

4.1 什么是内置对象

思考：为什么会有内置对象呢?
JavaScript 提供了多个内置对象：Math、 Date 、Array、String等
课堂案例：07.封装工具类.html
课堂案例：08.使用现有的工具类.html

4.2 怎么查看文档

JavaScript 标准内置对象 - JavaScript | MDN

4.3 Math对象

Math对象，它具有数学常数和函数的属性和方法。跟数学相关的运算（求绝对值，取整、最大值等）可以使用 Math 中的成员。

属性、方法名	功能
Math.PI	圆周率
Math.floor()	向下取整
Math.ceil()	向上取整
Math.round()	四舍五入版就近取整注意 -3.5 结果是 -3
Math.abs()	绝对值
Math.max()/Math.min()	求最大和最小值
Math.random()	获取范围在[0,1)内的随机值

4.4 日期对象

创建一个 JavaScript Date 实例，该实例呈现时间中的某个时刻。

使用Date实例化日期对象

new Date(); //用过了
new Date(value);
new Date(dateString); //用过了   var date2 = new Date("2022-09-22 16:22:15");
new Date(year, monthIndex [, day [, hours [, minutes [, seconds [, milliseconds]]]]]);

- 时间戳：以整数值来表示时间（比如2022-09-26 10:08:27 就对应 1664158107981）
- 计算规则：表示自 1970 年 1 月 1 日 00:00:00 到当前时间的毫秒数
- Date.now() ：返回当前系统的时间戳
- Date.parse("Mon Sep 26 2022 10:16:21 GMT+0800") ：将字符串格式的日期转换为时间戳

5 数组相关对象

5.1 检测是否为数组

instanceof运算符

instanceof可以判断一个对象是否是某个构造函数的实例

function Car(make, model, year) {this.make = make;this.model = model;this.year = year;
}
const auto = new Car('Honda', 'Accord', 1998);

console.log(auto instanceof Car);
// expected output: true

console.log(auto instanceof Object);
// expected output: true

Array.isArray()

Array.isArray() 用于确定传递的值是否是一个 Array

Array.isArray([1, 2, 3]);  // true
Array.isArray({foo: 123}); // false
Array.isArray('foobar');   // false
Array.isArray(undefined);  // false
当检测 Array 实例时，Array.isArray 优于 instanceof

5.2 数组元素的添加和删除

- push() 方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度。
- pop() 方法从数组中删除最后一个元素，并返回该元素的值。此方法会更改数组的长度。
- shift() 方法从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度。
- unshift() 方法将一个或多个元素添加到数组的开头，并返回该数组的新长度。
- 为什么这些方法都是操作的头和尾？