js如何将对象传入函数的参数，然后在函数内进行对于参数内对象的操作

Question

就是比如说在函数内进行，对于参数内对象的
设置事件触发脚本之类的。我正在写js库，要实现对于对象操作的函数。

Answer 1

如果你真的是想写一个 JS 库的话，我觉得可能还有不少功课要做。因为这个问题本身是一个非常基础的 JS 语法问题。在没有熟悉 JS、OOP 以及具有 JS 特色的 OOP 之前，我认为看别人写的库是可以的，但是要自己写库似乎会有点乏力。

把一个对象作为参数传入函数的时候，函数内部可以调用这个对象暴露出来的任何接口，包括「字段/属性」、「方法」等。如果你希望对该对象进行「事件」相关的操作，根据情况有几种不同的处理

1. 对象本身具备事件注册及触发的能力，只需要调用相关接口就好
2. 如果是想把对象作为参数传递给触发的事件，那只需要按事件触发接口的规范，传入这个对象就好。

举个例子，这是一个简单（但不够严谨）的事件处理对象示例：

// ES2015 引入的类语法 ❶
class Eventable {
    constructor() {
        this.events = {};
    }

    on(type, callback) {
        // ES2015 引入的模板字符串，或者称为插值字符串语法 ❷
        type = `${type}`.trim().toLowerCase();
        // ??= 是逻辑空赋值 ❸，它跟空值合并运算 ❹、可选链操作符 ❺ 等新语法有关
        const list = (this.events[type] ??= []);
        list.push(callback);
    }

    // ...args 是剩余参数语法 ❻。长相类似的还有展开语法 ❼，常用于解构和连接数组、对象
    trigger(type, ...args) {
        const event = {
            type,
            data: args
        };

        // 这里 ?? 就是空值合并运算符 ❹
        const list = this.events[type] ?? [];
        
        // () => { } 这种形式的是箭头函数 ❽
        list.forEach(fn => fn(event, ...args));
    }
}

参考文档

• ❶ class - JavaScript | MDN (mozilla.org)
• ❷ 模板字符串 - JavaScript | MDN (mozilla.org)
• ❸ 逻辑空赋值 (??=) - JavaScript | MDN (mozilla.org)
• ❹ 空值合并运算符 - JavaScript | MDN (mozilla.org)
• ❺ 可选链操作符 - JavaScript | MDN (mozilla.org)
• ❻ 剩余参数 - JavaScript | MDN (mozilla.org)
• ❼ 展开语法 - JavaScript | MDN (mozilla.org)
• ❽ 箭头函数 - JavaScript | MDN (mozilla.org)

使用它可以像这样：

const test = new Eventable();
test.on("hello", (e, name) => console.log(`hello ${name}`));
test.trigger("hello", "James");

现在假设触发事件是在一个业务函数中，这个业务函数可以取到一些用户名，需要触发事件依次打招呼，那么可能是这样：

function sayHello(helloManager, userList) {
    (userList ?? []).forEach(user => helloManager.trigger("hello", user));
}

sayHello(test, ["James", "Jane", "Jack"]);
// hello James
// hello Jane
// hello Jack

那么这个 sayHello 是不是就是你想要的，传入对象，处理事件的操作呢？

Answer 2

引用类型直接修改就行