为何实例化tile类存入数组时coords属性始终为0,0

异常现象 #

执行let $newTileData = new tile([1,3],{})传入自定义坐标实例化tile类，将生成的实例push存入mapdata对象的tiles数组后，控制台打印的实例对象coords属性始终固定为[0,0]，无论实例化时传入的coords取值是什么，属性都不会同步更新，始终保持初始设置的固定值。

复现代码 #

class tile {
    constructor(coords, layers) {
        this.coords = [0, 0];
        this.layers = [
            {sprite: ""},
            {sprite: ""},
            {sprite: ""},
            //player "layer" is here?
            {sprite: ""},
            {sprite: ""},
            {sprite: ""}
        ]
    }
}

let mapdata = {
    mapName: "Test",
    tiles: []
};

let $newTileData = new tile([1,3],{})
mapdata.tiles.push($newTileData);
console.log(mapdata);

问题核心原因 #

• 类构造函数虽然声明了coords、layers两个形参，但内部完全没有读取传入的实参值
• 构造函数中直接硬编码给实例的coords属性赋值为固定值[0,0]，传入的坐标值全程没有被使用
• 同理，声明的layers形参也没有参与赋值逻辑，哪怕实例化时传入自定义layers配置，也不会被应用到实例上

修复实现 #

将构造函数内的硬编码初始值替换为传入参数的赋值逻辑，同时补充参数默认值兼容未传参的场景：

class tile {
    // 为形参设置默认值，避免未传参时赋值为undefined
    constructor(coords = [0, 0], layers = []) {
        // 直接将传入的coords值赋值给实例属性
        this.coords = coords;
        // 若未传入有效layers配置，则使用默认的6层空sprite结构
        this.layers = layers.length ? layers : [
            {sprite: ""},
            {sprite: ""},
            {sprite: ""},
            //player "layer" is here?
            {sprite: ""},
            {sprite: ""},
            {sprite: ""}
        ]
    }
}

内容的提问来源于stack exchange，提问作者user736893