arr.with()

怎麼用 ?

arr.with([指定的index], [指定的值]);

以往想要更改 array 指定的 index 的值會這麼做

let arr = [1, 2, 3];

// 假設我想要這個arr但是第三項改為 4

// 必須先做一個深拷貝
let newArr = [...arr];
newArr[2] = 4;
// newArr = [1, 2, 4]

而要做到這樣的效果就可以使用;
arr.with();
如下;

let newArr = arr.with(2, 4);
// newArr = [1, 2, 4]

toSroted toReversed toSpliced

看起來應該蠻眼熟的?

沒錯,我自己的理解為 sort() reverse() splice() 的深拷貝版本

其實和前面 arr.with()一樣的概念,節省了拷貝的功夫

不只是省了一些拷貝的功夫,也有效能上的優化

以這個為例

[...arr].sort();

他在深拷貝和 sort function 都會 loop 一次

而相反的

arr.toSorted();

這就只會 loop 一次

structuredClone

這也是 js 深拷貝的 method

我就有一個疑問了

arr.toSorted() 和 structuredClone(arr).sort() => 這兩者的差異 ?

我問了 Chat GPT

結論是前者效能比較好

原因是因為 structuredClone 會 deep copy 一次

而 toSorted()他是直接 操作原始陣列後 return 一個新的 array

結語

以目前來看 structuredClone 的瀏覽器支援度較佳,所以可能會先用這個方法

等未來支援度更高的時候我覺得就可以用了

支援度補充:

structuredClone

toSorted