您如何更新您的項目以使用最新版本的 javascript？

Question

我目前正在構建一個新的個人 React 項目，並希望利用並使用 javascript 中添加的一些最新功能，例如可選鏈。 我曾嘗試在我的 index.html 文件中包含此腳本，但這不起作用。 在您的 React 項目中獲得 javascript 的最新穩定版本的秘訣是什么？ *編輯：抱歉，我沒有添加足夠的信息，但我正在嘗試 Reactjs 中的可選鏈接功能。 但是，當我運行此偶數處理程序時，它會出現以下錯誤消息：

Button.js:18 Uncaught TypeError: props.onClick 不是 function

這是真的，因為我想看看可選鏈接是如何工作的，但它顯然在這里不起作用。

const eventHandler = (e) => {
        console.log(e.target.value);
        // other code
        // onClick is the function that is passed from the parent component
        props?.onClick(e);
    }

Answer 1

老實說，在我研究它之前，我並沒有完全理解這種語法。 我不知道您可以將調用本身設為可選，並認為您只能針對屬性而不是方法/函數來執行此操作。 但是，您可以。 您只需要調整使用可選鏈接的方式：將其寫為：

possiblyUndefinedObject?.possiblyUndefinedFunction?.()

請參閱處理可選回調或事件處理程序

如果您使用帶有解構賦值的 object 的回調或獲取方法，您可能有不存在的值，除非您測試了它們的存在，否則您無法將其作為函數調用。 使用?. ，你可以避免這個額外的測試：

此外，請務必在支持它的瀏覽器中執行此操作（Firefox 68 不起作用，但 Chrome 84 可以）。

 const foo = {} // What you have try { foo?.bar(); } catch (err) { console.error(err); // TypeError: foo?.bar is not a function } // With?.() but undefined bar try { foo?.bar?.(); // Doesn't get called } catch (err) { console.error(err); // No error } foo.bar = () => console.log("bar"); // With?.() defined bar try { foo?.bar?.(); // "bar" } catch (err) { console.error(err); // No error }