01、Object对象

[**Object**](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object)是 JavaScript 的一种 数据类型，它用于存储各种键值集合和更复杂的实体，是一组数据和功能的集合。JS中几乎所有对象都是继承自Object，其他如Array、RegExp、Math、Map、Set都是他的子类型。

• 标准对象结构：**{ key(字符串/Symbol) : value(任意类型), ...}**
• 创建方式：new Ojbect()、字面量{key:value,key:value}、 Object.create(obj)
  • 使用new 构造器()，实现可重用的对象创建，任何函数都可以用于构造器（箭头函数除外），一般约定首字母大写，没有return返回值。
• 使用：对象.属性=value，对象["属性名"]=value，属性(Key)存在则赋值，不存在则创建并赋值。
• 删除属性：delete obj.prop
• 检测属性："key" in obj，返回bool
• 遍历属性：for(let key in obj)循环所有key。 | 属性/方法 | 描述 | | —- | —- | | 静态属性/方法 | | | Object.create(proto) | 使用指定的原型对象和属性创建一个新对象 | | Object.assign(target,…source)IE🚫 | 合并多个source对象到target对象并返回，复制一级属性的值，不能作为深拷贝。 | | Object.defineProperty(obj,prop) | 给对象添加一个属性 | | Object.entries(obj)IE🚫 | 返回给定对象自身可枚举属性的 [key, value] 数组（二维数组） | | Object.keys(obj) | 返回给定对象自身可枚举属性组成的数组 | | Object.values(obj)IE🚫 | 返回给定对象自身可枚举值组成的数组 | | Object.freeze(obj) | 冻结对象：其他代码不能删除或更改任何属性。 | | Object.getOwnPropertyDescriptor(o,p) | 返回对象指定属性的描述符，IE🚫 | | Object.getOwnPropertyNames(obj) | 所有自身属性的属性名（包括不可枚举属性不包括 Symbol 名称的属性）组成的数组 | | Object.getPrototypeOf(obj) | 返回指定对象的原型，（prototype /ˈprəʊtətaɪp/ 原型） | | Object.is(v1,v2) | 判断两个值是否为同一个值，支持值类型、引用类型 | | Object.isSealed() | 判断一个对象是否被密封 | | 构造函数 | | | Object() | 构造函数将给定的值包装为一个新对象 | | 实例属性/方法 | | | constructor | 指向 Object 构造函数 | | proto | 指向实例化的原型对象，已废弃，推荐Object.getPrototypeOf() | | hasOwnProperty(prop) | 判断指定对象自身是否存在指定属性 | | propertyIsEnumerable(prop) | 判断属性是否可枚举，枚举属性可被for…in循环迭代 | | isPrototypeOf(obj) | 判断是否在另一个对象的原型链上 | | toLocaleString() | 调用 toString() | | toString() | 返回字符串，可以重写 | | valueOf() | 返回对象的原始值 |

const obj1={};
const obj2={
        name:"zhagnsan",
        "age":"3",
        school:{    //属性值也是对象
                name:"龙腾幼儿园",
                address:"那边",
        },
        sayHello:function(name){    //属性值是函数
                console.log("hello "+name);
        },
}
obj2.sayHello("sam");
obj2.birthday="2022-12-12";//赋值操作：属性(Key)存在则赋值，不存在则创建+赋值
//可以用null为原型创建一个干净的对象，不会从从Object.prototype继承任何属性方法
const nobj = Object.create(null, { name: { value: "sam", enumerable: true } });
nobj.age = 20;
nobj.toString=Object.prototype.toString; //赋予toString()方法
Object.getOwnPropertyNames(["a","b"])    //[ "0", "1", "length" ]
Object.keys(["a","b"]) //[ "0", "1" ]
Object.getPrototypeOf([]); //Array []
const obj={name:"sam",sex:"male",say:function(){}};
obj.hasOwnProperty("name"); //true
obj.propertyIsEnumerable("name"); //true
obj.toString = function(){return JSON.stringify(this)};

对象属性

通过Object.**getOwnPropertyDescriptor**(obj,propertyName)方法可以获取一个属性的完整信息，返回的是一个“属性描述符”对象，包括几个主要属性：

• writable ：是否只读，true=可读可写。
• enumerable ：是否支持枚举。
• configurable ：如果为 true，则此属性可以被删除。
• value：属性的值

通过Object.**defineProperty**(obj, propertyName, descriptor)方法可添加/设置一个属性，属性描述符**descriptor**默认值都是false。JS的一些内置属性就是只读、不可删除的，如Math.PI。

function User(name, age) {
        this.name = name;
        this.age = age ? age : 18;
        function sayHi() { console.log("Hi,I'm " + name) };
}
let u1 = new User("sam");
let pname = Object.getOwnPropertyDescriptor(u1, "name");
//设置name值不可更改
Object.defineProperty(u1, "name", { writable: true });

descriptor主要结构如下：Object。Object.create(proto, propertiesObject)的第二个参数也是用的这个结构来描述属性。

let descriptor = {
        enumerable: false,
        configurable: false,
        writable: false,
        value: "value",
        get() { },
        set() { },
}
let pobj = {   //Object.create(proto, propertiesObject)的第二个参数
        proName1: descriptor,
        proName2: descriptor,
}

getter/setter属性访问器

对象中常用的属性都属于“数据属性”，存放数据没有额外逻辑。而访问器属性（accessor property），表现形式和普通属性一样，本质上一个取值、设置值的函数，可自定义逻辑，如数据合法性验证。

//只支持在字面量对象里使用访问器，而且“私有”变量_name还是会暴露出去。
    let obj = {
            age: 18,
            set name(value) {
                    let vs = String(value);
                    if (!vs || vs.length < 4 || vs.length > 12) {
                            throw Error("值必须是4到12的有效字符");
                    }
                    this._name = value;
            },
            get name() {
                    this._name ??= "sam";
                    return this._name;
            }
    };
    function User(name, age) {
            this.age = age ? age : 18;
            function sayHi() { console.log("Hi,I'm " + name) };
            //构造器里加访问器就是麻烦，而且_name还是会暴露出去
            Object.defineProperty(this, "name", {
                    set(value) {
                            if (!value || value.length < 4 || value.length > 12) {
                                    throw Error("值必须是4到12的有效字符");
                            }
                            this._name = value;
                    },
                    get() { return this._name; }
            })
    }
    let user = new User("sam");

02、JSON数据

JOSN（JavaScript Object Notation /nəʊˈteɪʃn/）是一种描述对象数据的语法，是一种通用的键值数据格式，很多语言都支持，用来存储、传输、处理数据。和Object定义相似，不同的是，属性名必须双引号包起来，属性值仅允许字符串，数字，数组，true，false，null或其他（JSON）对象，不支持函数。

• **JSON.**[**stringify**](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify)**(obj)**：对象转换（序列化）为字符串。
• **JSON.**[**parse**](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse)**(jsonstr)**：字符串反序列化为Json对象。 ```javascript let jobj={“name”:”same”};

let str1=JSON.stringify({name:”zhangsan”,age:11}); //‘{“name”:”zhangsan”,”age”:11}’ let obj1=JSON.parse(str1);

const jurl = “https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json“; let request = new XMLHttpRequest(); request.responseType = “json”; request.open(“GET”, jurl); request.onload = function () { let jobj = request.response; console.log(jobj); let h1=document.createElement(‘h1’); h1.textContent=jobj.squadName; document.body.appendChild(h1); } request.send();

<a name="nfmEc"></a>
# 03、Array数组
`[**Array**](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array)`数组是按序号排列的一组数据，从0开始，数组没有大小限制（不管是否设置了数组大小），长度可变，数据类型可以任意，很自由很渣！也不会报越界的错误。
- 通过`array[索引下标]`访问、设置数组元素。
- 通过length属性获取、设置长度。
- 可附加属性（Array属于对象），使用“非正整数”作为索引时，会附加属性，不影其器数组大小。
```javascript
var arr1=[1,2,3,4];
var arr2=new Array(1,2,3,4); //new并指定数据
var arr3=new Array(3);  //指定数组长度，别相信它，它是会变心的。
console.log(arr3.length); //3
console.log(arr3[6]);   //可以越界访问，返回undefined
arr3[6]="666"; 
console.log(arr3.length); //长度为7了
arr3.length=10;
arr3["name"]="sam"; //附加了属性name
console.log(arr3.name);  //sam
arr3["12"]="sam123"; //等同于arr3[12]

🔸数组遍历：

• 索引下标：遍历索引下标进行访问。for(var i=0;i<arr3.length;i++)
• **for...in**遍历数组里面的所有下标（键），包括数字索引、属性Key。
• **for...each**循环遍历集合的数值、索引下标，只有正常数组的部分。

🔸数组方法/属性：

var arr1=["a","b","c","d"];
console.log(arr1.pop());    //d
console.log(arr1.push("d","e"));    //5
arr1 = [13, 24, 51, 3,"6"]; 
console.log(arr1.sort()); // [13, 24, 3, 51, '6']
function sortN(a,b){
        return a-b;
}
console.log(arr1.sort(sortN)); // [3, '6', 13, 24, 51]
var newarr=arr1.concat("7",["a","b"]); //newarr=[3, '6', 13, 24, 51, '7', 'a', 'b']
//splice
var arr=[1,2,3,4];
console.log(arr.splice(0,1)); //[1]

04、Date日期

Date：日期时间对象，创建、获取日期，日期是一个包含年月日时分秒、及相关时间方法的数据对象。Date 时间基于 Unix Time Stamp，即自 1970 年 1 月 1 日（UTC）起经过的毫秒数。

const today = new Date();
const birthday = new Date('1995-02-07T03:24:00');
const birthday2 = new Date(1995, 11, 17, 3, 24, 0);
//计算年龄
const v1 = today-birthday; //867998585554 日期相减得到的是时间间隔的毫秒数
const age = Math.floor(v1 /(365*24*60*60*1000)); //27岁

05、Math数学公式

Math 是一个内置对象，拥有一些数学常数属性和数学函数方法。

:::warning ❗Math精度：很多 Math 函数都有一个精度，而且这个精度在不同实现中也是不相同的。这意味着不同的浏览器会给出不同的结果，甚至，在不同的系统或架构下，相同的 JS 引擎也会给出不同的结果！ :::

06、Maps/Sets带键集合

由Key值标记的键值[key, value]集合容器Map、Set。

Object与Map、Set的区别：

let map = new Map([[1,"N1"],["age",3]]);
map.set(2, "N2");
map.forEach((value,key)=>{  //注意是value在前面
        console.log(key+":"+value);
})
console.log(JSON.stringify(map)); //{} 什么都没有
let wset=new Set([1,2,3,"a"]);
wset.forEach((value)=>{
        console.log(value);
})
console.log(JSON.stringify(map)); //{} 什么都没有