JavaScript中数组的合并以及排序实现示例_基础知识

合并两个数组 - concat()
源代码:

<!DOCTYPE html>
<html>
<body>
​
<p id="demo">点击按钮合并数组。</p>
​
<button onclick="myFunction()">点我</button>
​
<script>
function myFunction()
{
var hege = ["Cecilie", "Lone"];
var stale = ["Emil", "Tobias", "Linus"];
var children = hege.concat(stale);
var x=document.getElementById("demo");
x.innerHTML=children;
}
</script>
​
</body>
</html>

测试结果:

Cecilie,Lone,Emil,Tobias,Linus

合并三个数组 - concat()
源代码:

<!DOCTYPE html>
<html>
<body>

<script>

var parents = ["Jani", "Tove"];
var brothers = ["Stale", "Kai Jim", "Borge"];
var children = ["Cecilie", "Lone"];
var family = parents.concat(brothers, children);
document.write(family);

</script>

</body>
</html>

测试结果:

Jani,Tove,Stale,Kai Jim,Borge,Cecilie,Lone

数组排序(按字母顺序升序)- sort()
源代码:

<!DOCTYPE html>
<html>
<body>
​
<p id="demo">Click the button to sort the array.</p>
​
<button onclick="myFunction()">Try it</button>
​
<script>
function myFunction()
{
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
var x=document.getElementById("demo");
x.innerHTML=fruits;
}
</script>
​
</body>
</html> 

测试结果:

Apple,Banana,Mango,Orange

数字排序(按数字顺序升序)- sort()
源代码:

<!DOCTYPE html>
<html>
<body>
​
<p id="demo">Click the button to sort the array.</p>
​
<button onclick="myFunction()">Try it</button>
​
<script>
function myFunction()
{
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return a-b});
var x=document.getElementById("demo");
x.innerHTML=points;
}
</script>
​
</body>
</html>  

测试结果:

1,5,10,25,40,100

数字排序(按数字顺序降序)- sort()
源代码:

<!DOCTYPE html>
<html>
<body>
​
<p id="demo">Click the button to sort the array.</p>
​
<button onclick="myFunction()">Try it</button>
​
<script>
function myFunction()
{
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return b-a});
var x=document.getElementById("demo");
x.innerHTML=points;
}
</script>
​
</body>
</html>

测试结果:

100,40,25,10,5,1

将一个数组中的元素的顺序反转排序 - reverse()
源代码:

<!DOCTYPE html>
<html>
<body>
​
<p id="demo">Click the button to reverse the order of the elements in the array.</p>
​
<button onclick="myFunction()">Try it</button>
​
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
​
function myFunction()
{
fruits.reverse();
var x=document.getElementById("demo");
x.innerHTML=fruits;
}
</script>
​
</body>
</html>  

测试结果:

Mango,Apple,Orange,Banana

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索javascript
数组
javascript 数组排序、javascript 合并数组、java两个数组合并排序、合并排序数组、合并两个排序的数组,以便于您获取更多的相关知识。

时间: 2024-11-02 01:29:49

JavaScript中数组的合并以及排序实现示例_基础知识的相关文章

JavaScript中将数组进行合并的基本方法讲解_基础知识

这里简单地讲两种方法: 第一种   var mergeTo = [4,5,6], mergeFrom = [7,8,9]; mergeTo = mergeTo.concat(mergeFrom); mergeTo; // is: [4, 5, 6, 7, 8, 9]   or   var a = [1,2], b = [3,4], c = a.concat(b);   第二种  var mergeTo = [4,5,6], var mergeFrom = [7,8,9]; Array.proto

Javascript中eval函数的使用方法与示例_基础知识

定义和用法 eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码. 语法 eval(string) 参数 描述 string 必需.要计算的字符串,其中含有要计算的 JavaScript 表达式或要执行的语句. 返回值 通过计算 string 得到的值(如果有的话). 说明 该方法只接受原始字符串作为参数,如果 string 参数不是原始字符串,那么该方法将不作任何改变地返回.因此请不要为 eval() 函数传递 String 对象来作为参数. 如果试图覆盖 eval

javascript中数组array及string的方法总结_基础知识

一.array的方法总结 会更改原来的的数组 push.unshift方法,返回length.增加值得就返回length,其他返回该元素 pop,shift返回该元素 reverse返回该元素 splice(start,deleteCount,addItem...),从原数组中删除和增加,返回删除的数组 不会改变原来的数组,返回新的数组 concat,join,slice(start,end) 记住这3个是返回新数组,其他的会改变原来的数组 二.Sting的方法总结 不对原始值做改变,都是返回一

详解JavaScript中数组和字符串的lastIndexOf()方法使用_基础知识

Array.prototype.lastIndexOf 和 String.prototype.lastIndexOf 是非常的实用的方法,不过很多人不知道它其实可以传递两个参数,第二个参数决定了搜索的起始位置: 语法 str.lastIndexOf(searchValue[, fromIndex]) lastIndexOf() 方法返回指定值在调用该方法的字符串中最后出现的位置,如果没找到则返回 -1.从该字符串的后面向前查找,从 fromIndex 处开始. 参数 1.searchValue

javascript中call apply 与 bind方法详解_基础知识

在JavaScript中,call.apply和bind是Function对象自带的三个方法,本文将通过几个场景的应用,来详细理解三个方法. call() call() 方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法. 当调用一个函数时,可以赋值一个不同的 this 对象.this 引用当前对象,即 call 方法的第一个参数. 通过 call 方法,你可以在一个对象上借用另一个对象上的方法,比如Object.prototype.toString.call([]),

Javascript中的迭代、归并方法详解_基础知识

迭代方法 在Javascript中迭代方法个人觉得尤为重要,在很多时候都会有实际上的需求,javascript提供了5个迭代方法来供我们操作,它们分别为: every() 对数组中的每一个项运用给定的函数,如果每项都返回true,那么就会返回true filter() 对数组中的每一个项运用给定的函数,把返回true的项组成一个新数组并返回 forEach() 对数组中的每一项运用给定的函数,但是没有任何的返回值 map() 对数组中的每一个项运用给定的函数并返回每次函数调用的结果组成新的数组

探讨JavaScript中的Rest参数和参数默认值_基础知识

Rest 参数 通常,我们需要创建一个可变参数的函数,可变参数是指函数可以接受任意数量的参数.例如,String.prototype.concat 可以接受任何数量的字符串作为参数.使用 Rest 参数,ES6 为我们提供一种新的方式来创建可变参数的函数. 我们来实现一个示例函数 containsAll,用于检查一个字符串中是否包含某些子字符串.例如,containsAll("banana", "b", "nan") 将返回true,contai

javascript中有趣的反柯里化深入分析_基础知识

写在前面的话:国内对前端的研究在某些方面也不逊色于国外,这篇文章虽然看不太懂,但我很欣赏这种深入研究的精神! 反科里化的话题来自javascript之父Brendan Eich去年的一段twitter. 近几天研究了一下,觉得这个东东非常有意思,分享一下.先忘记它的名字,看下它能做什么. 不要小看这个功能,试想下,我们在写一个库的时候,时常会写这样的代码,拿webQQ的Jx库举例. 我们想要的,其实只是借用Array原型链上的一些函数.并没有必要去显式的构造一个新的函数来改变它们的参数并且重新运

javascript中的作用域和上下文使用简要概述_基础知识

javascript中的作用域(scope)和上下文(context)是这门语言的独到之处,这部分归功于他们带来的灵活性.每个函数有不同的变量上下文和作用域.这些概念是javascript中一些强大的设计模式的后盾.然而这也给开发人员带来很大困惑.下面全面揭示了javascript中的上下文和作用域的不同,以及各种设计模式如何使用他们. 上下文 vs 作用域 首先需要澄清的问题是上下文和作用域是不同的概念.多年来我注意到许多开发者经常将这两个术语混淆,错误的将一个描述为另一个.平心而论,这些术语