JavaScript 对包含undefined的数组进行排序
在JavaScript中,数组用于将多个值保存在一个变量中。与只能保存一个值的变量相反,数组的每个元素都有一个与之关联的数字索引,可以通过该索引访问它。JavaScript中的数组从索引零开始,并可以使用多种不同的技术进行修改。
让我们来看看在JavaScript中对包含undefined的数组进行排序的一般情况。数组如下所示 –
var namearr = ["Zebra", "Yatch", undefined, "Egg", undefined];
对于包含未定义值的 JavaScript 数组的排序,可以使用 sort() 方法。当我们将 sort() 方法应用于数组时,它将显示以下输出:
Var namearr=[“Egg”,”Yatch”,”Zebra”,undefined,undefined];
让我们深入这篇文章,更好地了解如何在JavaScript中对包含未定义的数组进行排序。
在JavaScript中使用sort()方法
sort() 方法可以在数组中对项进行排序,然后返回一个新排序数组的引用。由于项被转换为字符串,所以默认的排序顺序是升序。
语法
以下是 sort() 方法的语法:
sort() // Functionless
sort((a, b) => { /* … */ } ) // Arrow function
sort(compareFn) // Compare function
sort(function compareFn(a, b) { /* … */ }) // Inline compare function
在JavaScript中对包含未定义值的数组进行排序的更多想法,我们来看下面的示例。
示例
在下面的示例中,我们声明一个包含未定义值的数组,然后使用 sort() 方法对数组进行排序,该方法首先显示数组中的值,然后显示未定义值。
<!DOCTYPE html>
<html>
<body>
<script>
var arrname = ["Frog", undefined, "Dog", undefined];
arrname.sort(function(a, b) {
if (a == undefined) {
a = ""
}
if (b == undefined) {
b = ""
}
return a.localeCompare(b);
});
document.write(JSON.stringify(arrname));
</script>
</body>
</html>
当脚本被执行时,它将生成一个由按升序排序的数组组成的输出,在网页上显示为首先是”values”,然后是”undefined”,这是由于运行脚本时触发的事件。
示例
考虑以下示例,我们通过在数组中声明一个包含未定义值的数组来运行脚本,在数组中我们使用 sort() 方法将数组从高值到低值进行排序,然后在末尾放置未定义的值。
<!DOCTYPE html>
<html>
<body>
<script>
const arr = ['yatch', undefined, undefined, 'bus'];
const sortdescending = arr.sort((a, b) => {
if (a === null) {
return 1;
}
if (b === null) {
return -1;
}
if (a === b) {
return 0;
}
return a < b ? 1 : -1;
});
document.write(JSON.stringify(sortdescending));
</script>
</body>
</html>
运行上述脚本后,输出窗口将弹出,显示一个按高值到低值排序的数组,以及一个由事件引起的末尾的未定义值。
示例
执行下面的代码来检查 sort() 方法如何帮助对包含未定义值的数组进行排序。
<!DOCTYPE html>
<html>
<body>
<p id="tutorial"></p>
<script>
data = [{
car: 'BMW',
rating: 'undefined'
}, {
bike: 'BENZ',
rating: 11.34,
jobTitle: 'engineering'
}, {
vehicle: 'RX100',
rating: 11.34,
jobTitle: 'mechanic'
}, ];
data.sort((x, y) => {
if (x.jobTitle && y.jobTitle) {
return (x.rating || 0) - (x.rating || 0);
} else if (x.jobTitle || y.jobTitle) {
return !(x.jobTitle) - !(y.jobTitle)
} else {
return (y.rating || 0) - (y.rating || 0);
}
});
document.getElementById("tutorial").innerHTML = JSON.stringify(data);
</script>
</body>
</html>
当脚本被执行时,事件被触发,并在网页上显示一个按升序排序的数组,先显示值,然后在数组末尾显示undefined值。