【JavaScript】sortメソッド 参照元はソートしないようにする

JavaScriptには、sortメソッドという配列などのデータを昇順や降順に並び替える便利なメソッドが用意されています。

しかし、このsortメソッドは、ソートする際の参照元のデータもソートされてしまいます。

本記事では、参照元のデータの並びは、そのままにしてsortメソッドを用いる方法を紹介します。

【おさらい】sortメソッド

参照元もソートされるというのは、どういうことか下のコードで説明します。

notSortedArray = ['a','z','c','x'];
sortingArray = notSortedArray.sort();

console.log(notSortedArray); //[ 'a', 'c', 'x', 'z' ]
console.log(sortingArray); //[ 'a', 'c', 'x', 'z' ]

1行目のnotSortedArrayを昇順にソートしたいということで、

2行目でsortメソッドを用いてソートし、sortingArrayに代入しています。

しかし、sortメソッドは参照元のデータもソートするので、notSortedArrayもソートされ、sortingArrayと同じ並び順になってしまいます。

参照元はそのままでソートする方法

方法1sliceメソッド

sliceメソッドは、配列をコピーして、別のオブジェクトとして返します。

引数で一部の配列をコピーすることも可能で、その場合、第一引数にコピーしたい最初のインデックス、第二引数にコピーしたい最後のインデックスを指定します。

今回は、配列をすべてコピーしたいので、slice(0,notSortedArray.length)とします。

また、すべてコピーしたい場合は、引数を省略でき、slice()で配列をまるまるコピーできます。

notSortedArray = ['a','z','c','x'];
sortingArray = notSortedArray.slice().sort();

console.log(notSortedArray); //[ 'a', 'z', 'c', 'x' ]
console.log(sortingArray); //[ 'a', 'c', 'x', 'z' ]

方法2concatメソッド

concatメソッドは、配列同士を結合するために使用します。

このメソッドは既存の配列を変更せず、別のオブジェクトとして返します。

notSortedArray = ['a','z','c','x'];
sortingArray = notSortedArray.concat().sort();

console.log(notSortedArray); //[ 'a', 'z', 'c', 'x' ]
console.log(sortingArray); //[ 'a', 'c', 'x', 'z' ]