Javascript 如果是'；它相当大？

我有一个创建画布的组件和另一个保存画布上某些事件/绘图状态的

useCanvas

组件

我在useCanvas上的回报相当大，需要大量回调和数据。这是一条通往糟糕设计的道路？感觉不对。我不知道有什么不同的方法可以设计这个方法来返回更干净的方法

以下是一个例子：

const TheMouseAndCanvas = (props) => {
    const [ 
        someFun, 
        someData, 
        setFunState, 
        someOther, 
        setMoreState, 
        recordMouse, 
        itsFlying, 
        setItsNotFlying, 
        setFun1, 
        SetRandomSet, 
        isItHappening, 
        letTest, 
        SetThisFeelsWrong, 
        itIsWrong, 
        setTesterr, 
        // etc, maybe another 5 or more
    ] = useCanvas();

    const aFunction = (e) => {
        // do things with event and use returns useCanvas
    }  

    // more such functions as aFunction

    return (
        // a canvas with callbacks
    )
}

例如，我的应用程序就是按照我的要求运行的，调试/使用它很容易，还可以添加

这是一条通往糟糕设计的道路

是的，至少有两个原因：

你需要记住你要归还的东西的顺序

重构将是痛苦且容易出错的

问题不是您有很多实用程序，而是您将这些实用程序作为数组返回，作为普通对象的对立面

const TheMouseAndCanvas = (props) => {
    const {
        someFun, 
        someData, 
        setFunState, 
        someOther, 
        setMoreState, 
        recordMouse, 
        itsFlying, 
        setItsNotFlying, 
        setFun1, 
        SetRandomSet, 
        isItHappening, 
        letTest, 
        SetThisFeelsWrong, 
        itIsWrong, 
        setTesterr, 
        // etc, maybe another 5 or more
    } = useCanvas();

    const aFunction = (e) => {
        // do things with event and use returns useCanvas
    }  

    // more such functions as aFunction

    return (
        // a canvas with callbacks
    )
}

使用这种方法，您不需要记住实用程序在返回数组中的位置，只需要记住实用程序名称

这给了您一些优势：

例如，您可以按字母顺序排列实用程序，以便更容易阅读所有实用程序

你永远不需要记住任何来自国外的订单

在顶部，您可以立即将所有方法分配给画布：

const TheMouseAndCanvas = (props) => {
    const utils = useCanvas();

    const aFunction = (e) => {
        // do things with event and use returns useCanvas
    }  

    // more such functions as aFunction

    return Object.assign(canvas, utils);
}

---

我希望你能理解这一点。

这是你提到的非常好的信息。。你能在回答中再详细说明一下吗？它似乎非常有用，谷歌搜索似乎没有带来太多。这是一个提示，而不是一个完整的解决方案，但基本上你有一个对象，你可以用来复制任何实用程序到任何其他对象，在这种情况下，画布，或者你可以传递它作为

，并有方法/道具附加。。。你有一个对象，你现在可以做“对象的事情”，而不是简单的数组。