JavaScript数组排序时未正确复制数组导致数据异常问题咨询

问题重现 #

我在HackerRank做技术测试时，需要保留未排序数组和排序后的数组做对比，初始代码如下：

function dataSort(thedata) {
    // Write your code here
    var unsorted = thedata
    var sorted = thedata
    console.log("not sorted", unsorted) // first log
    for(let i = 0; i < sorted.length; i++)
    {
        for(let j = i; j < sorted.length; j++)
        {
            if(sorted[i] > sorted[j])
            {
                let temp = sorted[i]
                sorted[i] = sorted[j]
                sorted[j] = temp
                
            }
        }
    }
    console.log("sorted",sorted) // second log
}
dataSort([1,3,4,2,1])

此时输出正常：

not sorted [ 1, 3, 4, 2, 1 ]
sorted [ 1, 1, 2, 3, 4 ]

但把第一个console.log移到排序逻辑之后，原本应该未排序的数组也变成了排序状态：

function dataSort(thedata) {
    // Write your code here
    var unsorted = thedata
    var sorted = thedata
    for(let i = 0; i < sorted.length; i++)
    {
        for(let j = i; j < sorted.length; j++)
        {
            if(sorted[i] > sorted[j])
            {
                let temp = sorted[i]
                sorted[i] = sorted[j]
                sorted[j] = temp
                
            }
        }
    }
    console.log("not sorted", unsorted) // first log
    console.log("sorted",sorted) // second log
}
dataSort([1,3,4,2,1])

输出结果：

not sorted [ 1, 1, 2, 3, 4 ]
sorted [ 1, 1, 2, 3, 4 ]

原因解析 #

• JavaScript中数组属于引用类型：当你执行var unsorted = thedata和var sorted = thedata时，并没有创建新的数组，只是让unsorted和sorted两个变量同时指向了内存中同一个数组对象。
• 第一次代码中，排序前就打印了unsorted，此时数组还未被修改，所以输出正常；第二次把打印放在排序之后，通过sorted变量对数组做的排序修改，会直接作用于这个唯一的数组对象，unsorted指向的也是它，所以打印结果自然和sorted一致。

解决方案 #

要真正创建独立的数组副本，需要使用数组复制方法，常用的有三种：

• 使用扩展运算符：var unsorted = [...thedata]
• 使用slice()方法：var unsorted = thedata.slice()
• 使用Array.from()：var unsorted = Array.from(thedata)

修正后的代码示例：

function dataSort(thedata) {
    // 创建原数组的副本，保存未排序状态
    var unsorted = [...thedata]
    // 再创建另一个副本用于排序
    var sorted = [...thedata]
    for(let i = 0; i < sorted.length; i++)
    {
        for(let j = i; j < sorted.length; j++)
        {
            if(sorted[i] > sorted[j])
            {
                let temp = sorted[i]
                sorted[i] = sorted[j]
                sorted[j] = temp
                
            }
        }
    }
    console.log("not sorted", unsorted)
    console.log("sorted",sorted)
}
dataSort([1,3,4,2,1])

此时无论打印顺序如何，unsorted都会保持原数组的未排序状态，sorted是排序后的结果。

内容的提问来源于stack exchange，提问作者dhanyn10