ES6对象

最新推荐文章于 2025-10-26 23:11:16 发布

原创最新推荐文章于 2025-10-26 23:11:16 发布 · 170 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html #javascript

1.1 新增技巧

1.属性简写：属性名和属性值相同，只写属性名即可。

2.方法简写：方发名和方法相同，只写方法即可。

function createUser(loginId,loginPwd,nickName){
    const say=function(){
        console.log(loginId,nickName);
    }
    return{
        loginId,//1.属性简写
        loginPwd,
        nickName,
        say,//2.方法简写
        fun(){
            console.log(this.loginId)
        }
    }
}
const user=createUser("01","123456","abc");
console.log(user);

3.计算属性名：对象的属性名可以引用变量值。

//3.计算属性名

const prop1="name";
const prop2="age";
const prop3="say";
const user={
    [prop1]:"张三",
    [prop2]:30,
    [prop3](){
        console.log(this[prop1],this[prop2])
    }
}
console.log(user);

1.2 新增API

1.is() 判断两个值是否相等，类似于===，除了NaN和0。

// 1.is()
console.log(Object.is(NaN,NaN))//true
console.log(Object.is(+0,-0))//false
console.log(Object.is({},{}))//false
console.log(Object.is(1,2))//false

2.assign()用于混合对象，带浅克隆。

//2.assign()
const obj1={
    a:123,
    b:456,
    c:789
}
const obj2={
    a:789,
    b:"abc"
}
//参数个数不定
const obj=Object.assign({},obj1,obj2)
console.log(obj)

3.getOwnPropertyNames()获取对象的属性名，返回一个数组，数组中的数据会枚举出来对象的属性。

3.getOwnPropertyNames()
const obj={
    e:1,
    a:2,
    c:3,
    b:4,
    0:5,
    3:6,
    1:7
}//对象的属性渲染顺序会按照浏览器厂商规定
const arr=Object.getOwnPropertyNames(obj)
console.log(arr)

4.setPropertypeOf()设置对象的隐式原型。

//4.setPrototypeOf()
const obj1={
    a:1
}
const obj2={
    b:2
}
//obj1.__prop__=obj2//必须通过构造函数来完成
Object.setPrototypeOf(obj1,obj2)
console.log(obj1)

1.3 面向对象：class 类

1.面向对象和面向过程的思想

//面向过程：只注重过程（几步），功能较小
//1.打开冰箱门
function openFridge(){}
//2.把大象放进去
function elephantIn(){}
//3.关上冰箱
function closeFridge(){}



//面向对象：主要考虑对象个数，对象的参数和方法，针对大型项目和大型模块
function Elephant(){
    this.tiji=tiji;
}
function Frifge(){
    this.width=width;
}
Fridge.prototype.opDoor=function(){}
Fridge.prototype.closeDoor=function(){}
Fridge.prototype.join=function(){}
let fridge=new Fridge()
let ele=new Elephant()

fridge.openDoor()
fridge.join(ele)
fridge.closeDoor()

2.class类的创建

class Person{
    constructor(job,name,age,sex){
        this.job=job;
        this.name=name;
        this.age=age;
        this.sex=sex;
        //this.print=function(){
        //    console.log("实例方法")
//console.log(`姓名：${this.name},工作：${this.job}，年龄：${this.age}，性别:${this.sex}`)
        //}
    }
    print(){
        console.log("原型方法")
console.log(`姓名：${this.name},工作：${this.job}，年龄：${this.age}，性别:${this.sex}`)
    }
}
const p1=new Person("程序猿","jack","25","男")
p1.print()