　　为了纵向显示名字，在使用join() 函数的时候，在元素之间我们用了“<br/>” 而不是“, ”了，再利用html()将带标签对的文本解析到p元素中。這里利用的函数是html()而不是text()，如果继续使用text()函数的话，<br/>元素将会原原本本的出现在页面中了，这也就是 html() 函数与text() 函数的区别了。

3. 将数组成员显示在有序列表元素<ol>中主要函数 each() append()

<body>
    <h3>数组成员有：</h3>
    <ol></ol>
</body>

$(document).ready(function () {
    var members = ["张三", "李四", "王老五", "赵老六", "王二麻子"];
    var ol = $("ol");
    $.each(members, function (index, item) {
        ol.append("<li>" + item + "</li>");
    })
});

　　　利用each()函数遍历所有数组元素，在利用append()函数插入到<ol>元素中，成为他的子级。

4. 利用html元素创建数组，并计算数组长度　主要函数 get()

<body>
    <h3>数组成员有：</h3>
    <ol>
        <li>张三</li>
        <li>李四</li>
        <li>王老五</li>
        <li>赵老六</li>
        <li>王二麻子</li>
    </ol>
    <p></p>
    <h3 id="h3"></h3>
</body>

$(document).ready(function () {
    var members = $("li").get();
    var string = "";
    $.each(members, function (i, item) {
        string += item.innerHTML + ", ";
    });
    $("p").text(string);
    $("#h3").text("数组长度是：" + members.length);
});

//利用函数get(),取得所有<li>元素，存入 members 对象中，此时members存了5个li元素，
//然后利用each()函数遍历members，//将每个<li>元素的文本取出（innerHTML 是个属性）叠加到一个变量string中，
//在将这个string赋个p元素的文本，
//最后我们利用数组的属性length,得到数组的长度。

3.2 数组元素的操作

　　将数组中的元素成员，全部转换成字母大写使用toUpperCase()函数相反装成小写是toLowerCase()

<body>
    <h3>数组成员有：</h3>
    <p></p>    
</body>

$(document).ready(function () {
var members = ["Jolinson", "Steve", "Dive", "John", "Damon", "Joy"];
members = $.map(members, function (item, i) { //item 是数组的各个元素，i 是索引，从0开始
    return (i + 1 + ". " + item.toUpperCase());
});
$("p").html(members.join("<br/>"));
});

　　上面的例子主要是为了了解map()函数，map()函数在之前的手册中，也介绍过，“把当前匹配集合中的每个元素传递给函数，产生包含返回值的新 jQuery 对象。”

　　這里，map()函数，是迭代数组的每个元素，并为每个元素调用一次回调函数。它的语法是这样子的。

map(array,callback);

　　在上面的例子中，我们为每个数组元素加了下标，并用toUpperCase()函数，将数组成员转成大写返回。

　　其实，这个效果，用each也能实现。

$(document).ready(function () {
var members = ["Jolinson", "Steve", "Dive", "John", "Damon", "Joy"];
var html = [];
$.each(members, function (i, item) {
html.push(i + 1 + ". " + item.toUpperCase());
})
$("p").html(html.join("<br/>"));
});

　　我们对比可以看出，两个同时都是对数组元素进行遍历，一个是回调函数的参数顺序不同，一个是有返回值，一个无返回值。

3.3 数组元素的筛选

　　对数组元素数据的筛选与展示

<body>
    <h3>数组成员有：</h3>
    <p id="P1"></p>  
    <h3>筛选后的数组成员有(长度>=5)：</h3>
    <p id="P2"></p> 
    <h3>数组成员有：</h3>
    <p id="P3"></p>  
    <h3>筛选后的数组成员有(使用正则表达式 开头字母A-K)：</h3>
    <p id="P4"></p>   
</body>

$(document).ready(function () {
var members = ["Jolinson", "Steve", "Dive", "John", "Damon", "Joy"];
$("#P1").html(members.join(", "));
members = $.grep(members, function (item, i) {
    return item.length >= 5;
});
$("#P2").html(members.join(", "));

/*----------------------------------------------------*/
var arr = ["Jolinson", "Steve", "Dive", "545sd", "23154", "55855"];
$("#P3").html(arr.join(", "));
arr = $.grep(arr, function (item) {
    return item.match(/^[A-K]/);
});
$("#P4").html(arr.join(", "));
});

　　使用函数grep()对数组元素进行筛选。这个方法为分析整个数组元素，为每个元素分别调用回调函数。在回调函数中过滤不想要的元素，留下我们所想要的值。

　　它的语法是这样的：

grep(array,callback,boolean);

　　array：是原始数组，所需要被筛选的数据数组
　　callback: 是回调函数，只是筛选，回调函数有两个参数，第一个是数组元素，第二个是索引值
　　boolean: 通常省略，默认的为false，没有效果。如果为true，则筛选相反的集合。如上面例子那样，默认是false,
　　筛选的是，元素长度大于等于5的元素，如果是true的话，那么选择的就是长度小于5的元素了。

　　/********************************************************************************************/

　　使用函数match()来定义正则表达式，匹配元素。match()是String类的一个方法，用于决定指定的字符串对象是否匹配指定的正则表达式。
　　对于如何编写正则表达式，我建议可以在博客园搜搜，有很多。

　　下面是效果：

3.4 数组元素的排序

　　字符串数组与数组数组的排序

<body>
    <h3>字符串数组成员有：</h3>
    <p id="P1"></p>  
    <h3>排序后的数组成员：</h3>
    <p id="P2"></p> 
    <h3>数值数组成员有：</h3>
    <p id="P3"></p>  
    <h3>排序后的数组成员有：</h3>
    <p id="P4"></p>    
</body>

$(document).ready(function () {
var members = ["Jolinson", "Steve", "Dive", "John", "Damon", "Joy"];
$("#P1").html(members.join(", "));
members = members.sort();
$("#P2").html(members.join(", "));
var intArr = [54, 32, 65, 12, 87, 11, 4, 2];
$("#P3").html(intArr.join(", "));
intArr = intArr.sort(function (a, b) { return a - b; });
$("#P4").html(intArr.join(", "));
});

　　字符串数组排序

　　函数sort() 按照字母顺序（基于ASCII排序）为字符串数组排序，所以最好统一命名，要么都以小写开头，要么都以大写开头。

　　利用函数sort()之后，排序之后的结果集将会返回。

　　如果使用sort()函数给数值数组排序，会出现12 比 2 小的情况。原因是因为1的ASCII值小于2的ASCII值。

　　数值数组排序

　　因此为了正常数值的大小比较，我们定义了一个比较函数（想想C#的委托已加C#版本委托找最大值）。

　　当函数返回值小于0时，a < b

　　当函数返回值大于0时，a > b

　　当函数返回值等于0时，a = b

　　return a - b;這里是升序排列，如果进行降序排列只需将 return a - b;改为 return b - a ;

　　效果

3.5 数组的拆分与合并

<body>
    <p id="P1"></p>  
    <p id="P2"></p> 
    <p id="P3"></p>  
    <p id="P4"></p>  
    <p id="P5"></p>     
</body>

$(document).ready(function () {
　　/*拆分*/
    var members = ["Jolinson", "Steve", "Dive", "John", "Damon", "Joy"];
    $("#P1").html("字符串数组成员有：" + members.join(", "));
    var subMembers = members.splice(0, 4);
    $("#P2").html("拆分数组成员0-4：" + subMembers.join(", "));
    $("#P3").html("拆分后的原数组成员还有：" + members.join(", "));
    members.splice(0, 0, "Vakk", "John", "Cath", "Wamy");
    $("#P4").html("利用splice()添加原数组成员：" + members.splice(0, 0, "Vakk", "John", "Cath", "Wamy") + "<br/>" + members.join(", "));

    /*合并*/
    var ColMembers = members.concat(subMembers);
    $("#P5").html("合并原数组和被切分的数组：" + ColMembers.join(", ") + "<br/>原数组：" + members.join(", ") + "<br/>被切割出来的数组：" + subMembers.join(", "));
});

　　拆分
　　函数splice(),移除或者添加数组元素，并返回被删除的数组元素部分，其余的部分继续留在原来的数组中。
　　语法：

array.splice(index,howmany,item1,.....,itemX);

　　array ：原始数组
　　index ：指定索引的位置，从哪里开始删除，使用负数，则表示从后面开始
　　howmany ：指定从原始数组中删除多少元素，如果是0则不删除任何元素
　　item1,.....,itemX ：是可选参数，往原始数组里面添加新的元素，以第一个参数下标后面开始添加
　　合并
　　函数concat()，用于连接两个或多个数组,此方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。
　　语法：

array.concat(array1,array2,......,arrayn);

　　在写到splice()函数的时候，我突然想起之前有一个函数，slice()函数可提取字符串的某个部分，并以新的字符串返回被提取的部分。
　　string.slice(start,end);
　　start : 开始索引下标
　　end ：结束索引下标

<script type="text/javascript">
var str="Hello world!"
document.write(str.slice(0));//从下标0开始取，取到结尾 Hello world!
document.write("<br />");//
document.write(str.slice(6,11));//取下标6-11的字符串 world
document.write("<br />");//
document.write(str);//原本字符串未变 Hello world! 
</script>

3.6 字符串的切割

　　将数值数组转换成字符串，在切割字符串取子字符串

$(document).ready(function () {
var intArr = [12, 32, 15, 89, 57, 46, 84];
var string = intArr.join("");
var subString = string.substr(0, 6);
document.write("原始数组：" + intArr.join(", ") + "<br/>");
document.write("将原始数组转成字符串：" + string + "<br/>");
document.write("切割后的字符串：" + subString + "<br/>");
});

　　函数substr() 可在字符串中抽取从 start 下标开始的指定数目的字符。

string.substr(start,length);//start开始下标，length要截取的长度

　　返回一个新的字符串，包含从 stringt的下标start处开始的 length 个字符。
　　如果没有指定 length，那么返回的字符串包含从 start 到 string 的结尾的字符。

3.7 对象数组的创建与遍历，排序

$(document).ready(function () {
//创建对象数组，每个对象包含三个属性 Name,Age,Gender ， json数组
var students = [
{
    "Name": "Joy",
    "Age": 32,
    "Gender": "男"
},
{
    "Name": "Lily",
    "Age": 23,
    "Gender": "女"
},
    {
        "Name": "OldMan",
        "Age": 78,
        "Gender": "男"
    },
    {
        "Name": "Man",
        "Age": 38,
        "Gender": "男"
    }
    ];
$.each(students, function (i, item) {
    $("body").append("<p id = " + i + ">" + item.Name + "  " + item.Age + "  " + item.Gender + "</p>");
})
$("body").append("<p><b>名字排序（升）</b></p>");
students = students.sort(function (a, b) {
    if (a.Name > b.Name) {
        return 1;
    } else if (a.Name < b.Name) {
        return -1;
    } else {
        return 0;
    }
});
$.each(students, function (i, item) {
    $("body").append("<p id = " + i + ">" + item.Name + "  " + item.Age + "  " + item.Gender + "</p>");
})
$("body").append("<p><b>年龄排序（降）</b></p>");
students = students.sort(function (a, b) {
    return a.Age - b.Age;
});
$.each(students, function (i, item) {
    $("body").append("<p id = " + i + ">" + item.Name + "  " + item.Age + "  " + item.Gender + "</p>");
});
});