javascript - 关于es6的问题

问题描述

问 题

//example1
        let name = 'Anna';
        let age = 25;
        let ageField = "age";
        let obj = {
            name, 
            [ageField]:26,
            "greet me"(){
                console.log(this.name + ':' + this.age);
            }
        }
        obj["greet me"]();

//example2
        let name = 'Anna';
        let age = 25;
        let ageField = age;
        let obj = {
            name,  
            ageField:26,
            "greet me"(){
                console.log(this.name + ':' + this.age);
            }
        }
        obj["greet me"]();

//example3
        let name = 'Anna';
        let age = 25;
        let ageField = age;
        let obj = {
            name, 
            ageField,
            "greet me"(){
                console.log(this.name + ':' + this.age);
            }
        }
        obj["greet me"]();

这三个为什么只有一个能读取到正确的值，其他的都是undefined？解释一下原因。。

解决方案

---

输出一下 this 其实就很清楚了

console.log(this.name + ':' + this.age, this, this === obj)

需要注意的是：

• [ageField] 是动态赋值属性名（Computed Property Names），它取 ageField 变量的值 age

• ageField 是属性初始化简写（Property Initializer Shorthand），它其实是 ageField: ageField 的简写，因此 obj 不存在 age 属性，this.age 自然是 undefined

这篇关于javascript - 关于es6的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！