Maison  >  Article  >  interface Web  >  Définition de tableaux et d'opérations et d'opérations de tableau jquery en JavaScript jQuery

Définition de tableaux et d'opérations et d'opérations de tableau jquery en JavaScript jQuery

高洛峰
高洛峰original
2017-02-06 09:55:051257parcourir

Tout d'abord, je vais vous présenter les connaissances pertinentes sur la définition de tableaux et d'opérations en javascript jquery. Le contenu spécifique est le suivant :

1. Comprendre les tableaux

Un tableau est. une collection de certains types de données, et le type de données Il peut s'agir d'un entier, d'une chaîne ou même d'un objet
Javascript ne prend pas en charge les tableaux multidimensionnels, mais parce que les tableaux peuvent contenir des objets (un tableau est aussi un objet ), les tableaux peuvent réaliser des fonctions similaires aux tableaux multidimensionnels en s'emboîtant les uns les autres

1.1 Définir le tableau

Déclarer un tableau avec 10 éléments

var a = new Array(10);

À ce moment , l'espace mémoire a été ouvert pour a, contenant 10 éléments, ajoutez [indice au nom du tableau ] pour appeler, par exemple a[2] mais l'élément n'a pas été initialisé à ce moment, l'appel retournera undefined

Le code suivant définit un tableau de variables et attribue une valeur

var a = new Array();
a[0] = 10;
a[1] = "aaa";
a[2] = 12.6;

comme mentionné ci-dessus. Après cela, les objets peuvent être placés dans le tableau, par exemple, le code suivant 🎜>a et b sont tous deux tableaux, mais b utilise une déclaration implicite pour créer une autre instance. Si alert(a==b) est utilisé à ce moment, false apparaîtra

var a =  new Array();
a[0]  = true;
a[1]  = document.getElementByIdx_x("text");
a[2]  = {x:11, y:22};
a[3]  = new Array();
1.2 Tableau multidimensionnel

En fait, Javascript ne prend pas en charge les tableaux multidimensionnels. En asp, vous pouvez utiliser dim a(10,3) pour définir des tableaux multidimensionnels. En Javascript, si vous utilisez var a = new Array(10,3), une erreur sera. rapporté

Mais comme mentionné précédemment, un tableau peut contenir des objets, donc un élément du tableau peut être déclaré comme un tableau, par exemple,

var a = new Array(1, 2, 3, 4, 5);
var b = [1, 2, 3, 4, 5];

se voit attribuer une valeur lors de la déclaration


L'effet est le même, a utilise une instanciation régulière, b est une déclaration implicite et le résultat est un tableau multidimensionnel

var a = new Array();
a[0] = new Array();
a[0][0] = 1;
alert(a[0][0]); //弹出 1
1.3 Littéraux de tableau

C'est vraiment vrai Je ne sais pas comment ça s'appelle en chinois, tableau de texte ?

En parlant de tableaux, nous devons parler des littéraux de tableau. Les tableaux sont en fait des objets spéciaux. Les objets ont des propriétés et des méthodes uniques. Les valeurs et les appels sont obtenus via le nom de l'objet.property, object.method() et les tableaux le sont. obtenus via les marqueurs suivants sont utilisés pour obtenir des valeurs. Les littéraux de tableau sont similaires aux tableaux dans la mesure où ils sont tous deux des collections d'un certain type de données. Cependant, les littéraux de tableau sont fondamentalement un objet, et leur déclaration et leur appel sont différents des tableaux

.
var a = new Array([1,2,3], [4,5,6],  [7,8,9]);
var b = [[1,2,3], [4,5,6], [7,8,9]];

Créer un objet simple. Généralement, l'appel se fait via aa

C'est une autre façon de créer un objet, le résultat est le même

2. Fonctionnement des éléments du tableau


Comme mentionné ci-dessus, vous pouvez passer un tableau [indice] Pour lire et écrire des éléments

var aa = new Object();
aa.x = "cat";
aa.y = "sunny";
alert(aa.x);  //弹出cat
, la plage des indices est 0 – (23(exposant 2) - 1). Lorsque l'indice est un nombre négatif, une virgule flottante ou même une valeur booléenne, le tableau sera automatiquement converti en un type d'objet, tel que

var a = {x:"cat",  y:"sunny"};
alert(a["y"]); //弹出sunny
À ce moment-là. , c'est équivalent à b["2.2"] = "XXXXX"

2.1 Boucle de tableau

C'est le plus couramment utilisé lors du parcours. tableau, le code apparaîtra de 1 à 6 dans l'ordre

Il existe également un

var b  = new Array();
b[2.2]  = "XXXXX";
alert(b[2.2]); //-> XXXXX

qui apparaîtra de 1 dans l'ordre à 6, for...in consiste à parcourir l'objet (le tableau est un objet spécial). Il est utilisé sur le tableau, car le tableau n'a pas de nom d'attribut, la valeur est affichée directement sur l'objet, par exemple. comme suit

var a = [1,2,3,4,5,6];
for(var i =0; i<a.length; i++){
alert(a[i]);
}

À ce moment, e obtient le nom de l'attribut, c'est-à-dire x, y, x, et pour obtenir la valeur, le nom du tableau [attribut] est utilisé, donc a[e] est équivalent à a[" x”], a[“y”], a[“z”]

2.2 Fonctions de tableau communes

concat

var a = [1,2,3,4,5,6];
for(var e in a){
alert(e);
}
Ajoute un tableau après le tableau existant et renvoie un nouveau tableau, n'affecte pas le tableau existant

var a = {x:1,y:2,z:3};
for(var e in a){
alert(e  + ":" + a[e]);
}
Il convient de noter qu'il ne peut être utilisé que pour des tableaux ou des chaînes, si le connecté (le a précédent) est une valeur numérique ou une valeur booléenne, un objet, une erreur sera signalée. Lorsque la chaîne est connectée au tableau, la chaîne sera épissée avec le premier élément du tableau pour se former. un nouvel élément, et le tableau sera connecté à la chaîne pour ajouter de nouveaux éléments (je n'en connais pas la raison, veuillez la divulguer si vous la connaissez. Pour les tableaux contenant des tableaux et des objets, conservez-les tels qu'ils sont après). rejoindre

join

et utiliser les séparateurs spécifiés pour connecter les tableaux aux chaînes

C'est facile à comprendre, mais il convient de le noter que seuls les tableaux unidimensionnels sont convertis. S'il y a des tableaux dans le tableau, la connexion de chaîne spécifiée par join ne sera pas utilisée, mais la valeur par défaut toString() sera utilisée, telle que

var a = [123];
var b = "sunnycat";
var c =  ["www",21,"ido"];
var d = {x:3.14, y:"SK"};
var e = [1,2,3,4,[5,6,[7,8]]];
alert(a.concat(b));   // -> 123,sunnycat
alert(a); //  -> 123
alert(b.concat(c, d));    // -> sunnycatwww,21,ido[object  Object]
alert(c.concat(b));   // -> www,21,ido,sunnycat
alert(e.concat(11,22,33).join(" #  "));    // -> 1 # 2 # 3  # 4 # 5,6,7,8 # 11 # 22 # 33

<.>

Le tableau à l'intérieur du tableau est inutile* connexion

pop

Supprimer le dernier élément du tableau et renvoyer l'élément

var a = [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,&#39;d&#39;,&#39;e&#39;,&#39;f&#39;,&#39;g&#39;];
lert(a.join(","));  // -> a,b,c,d,e,f,g 相当于a.toString()
alert(a.join(" x ")); // -> a x b x c x d x e x f x g

Si le tableau est vide, renvoie undéfini

push
var a =  [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,&#39;d&#39;,&#39;e&#39;,&#39;f&#39;,&#39;g&#39;,[11,22,33]];
alert(a.join(" * ")); // -> a * b * c * d * e * f * g *  11,22,33

Ajoute un tableau à la fin du tableau et renvoie la nouvelle longueur du tableau

et concat est que concat n'affecte pas le tableau d'origine et renvoie directement un nouveau tableau, tandis que push modifie directement le tableau d'origine et renvoie la nouvelle longueur du tableau

sort

var a =  ["aa","bb","cc"];
document.write(a.pop());  // -> cc
document.write(a);    // -> aa, bb
Tri par tableau, regardons d'abord un exemple

Le résultat n'est-il pas surprenant Oui, le tri ne se fait pas par taille entière, mais par comparaison de chaînes ? , c'est-à-dire en prenant le premier Comparez les codes ANSI d'un caractère, le plus petit étant classé en premier S'ils sont identiques, prenez le deuxième caractère et comparez. Si vous souhaitez comparer en fonction de valeurs entières, vous pouvez le faire <. la m>

var a =  ["aa","bb","cc"];
document.write(a.push("dd"));  // -> 4
document.write(a);    // -> aa,bb,cc,dd
document.write(a.push([1,2,3])); // -> 5
document.write(a);    // -> aa,bb,cc,dd,1,2,3
sort() a un paramètre facultatif, qui est la fonction dans le code. Il s'agit d'un exemple simple. Les non-nombres ne peuvent pas être triés. , donc je n'entrerai pas dans les détails ici

reverse

Le tri inversé des tableaux est le même que sort(), en prenant la valeur ASCII du premier caractère pour comparaison

var a = [11,2,3,33445,5654,654,"asd","b"];
alert(a.sort()); // -> 11,2,3,33445,5654,654,asd,b
Si le tableau contient également un tableau, celui-ci sera traité comme un objet. Il ne résoudra pas les éléments

.

按理应该是11排最后面,因为这里把 4,11,33 当做完整的对象比较,所以被排在第一位。看不明白的话,用join()串起来,就明了多

shift

删除数组第一个元素,并返回该元素,跟pop差不多

var a =  ["aa","bb","cc"];
document.write(a.shift());  // -> aa
document.write(a);    // -> bb,cc

当数组为空时,返回undefined

unshift

跟shift相反,往数组最前面添加元素,并返回数组新长度

var a =  ["aa","bb","cc"];
document.write(a.unshift(11));  // -> 4 注:IE下返回undefined
document.write(a);    // -> 11,aa,bb,cc
document.write(a.unshift([11,22]));  // -> 5
document.write(a);    // -> 11,22,11,aa,bb,cc
document.write(a.unshift("cat")); // -> 6
document.write(a);    // -> cat,11,22,11,aa,bb,cc

注意该方法,在IE下将返回undefined,貌似微软的bug,我在firefox下则能正确发挥数组新长度

slice

返回数组片段

var a = [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,&#39;d&#39;,&#39;e&#39;,&#39;f&#39;,&#39;g&#39;];
alert(a.slice(1,2)); // -> b
alert(a.slice(2));  // -> c,d,e,f,g
alert(a.slice(-4));  // -> d,e,f,g
alert(a.slice(-2,-6));  // -> 空

a.slice(1,2),从下标为1开始,到下标为2之间的数,注意并不包括下标为2的元素
如果只有一个参数,则默认到数组最后
-4是表示倒数第4个元素,所以返回倒数的四个元素
最后一行,从倒数第2开始,因为是往后截取,所以显然取不到前面的元素,所以返回空数组,如果改成 a.slice(-6,-2) 则返回b,c,d,e

splice

从数组删除某片段的元素,并返回删除的元素

var a = [1,2,3,4,5,6,7,8,9];
document.write(a.splice(3,2));  // -> 4,5
document.write(a);    // -> 1,2,3,6,7,8,9
document.write(a.splice(4)); // -> 7,8,9 注:IE下返回空
document.write(a);    // -> 1,2,3,6
document.write(a.splice(0,1));  // -> 1
document.write(a);    // -> 2,3,6
document.write(a.splice(1,1,["aa","bb","cc"]));  // -> 3
document.write(a);    // -> 2,aa,bb,cc,6,7,8,9
document.write(a.splice(1,2,"ee").join("#")); // -> aa,bb,cc#6
document.write(a);    // -> 2,ee,7,8,9
document.write(a.splice(1,2,"cc","aa","tt").join("#")); // -> ee#7
document.write(a);    // -> 2,cc,aa,tt,8,9

注意该方法在IE下,第二个参数是必须的,不填则默认为0,例如a.splice(4),在IE下则返回空,效果等同于a.splice(4,0)

toString

把数组转为字符串,不只数组,所有对象均可使用该方法

var a =  [5,6,7,8,9,["A","BB"],100];
document.write(a.toString());  // -> 5,6,7,8,9,A,BB,100
var b = new Date()
document.write(b.toString());  // -> Sat Aug 8 17:08:32 UTC+0800  2009
var c = function(s){
alert(s);
}
document.write(c.toString());  // -> function(s){ alert(s); }

布尔值则返回true或false,对象则返回[object objectname]
相比join()方法,join()只对一维数组进行替换,而toString()则把整个数组(不管一维还是多维)完全平面化
同时该方法可用于10进制、2进制、8进制、16进制转换,例如

var a =  [5,6,7,8,9,"A","BB",100];
for(var i=0; i<a.length; i++){
document.write(a[i].toString()  + " 的二进制是 "  + a[i].toString(2) + " ,八进制是 " + a[i].toString(8) + " ,十六进制是 " + a[i].toString(16)); //  -> 4,5
}

输出结果

5 的二进制是 101 ,八进制是 5 ,十六进制是 5
6 的二进制是 110 ,八进制是 6 ,十六进制是 6
7 的二进制是 111 ,八进制是 7 ,十六进制是 7
8 的二进制是 1000 ,八进制是 10 ,十六进制是 8
9 的二进制是 1001 ,八进制是 11 ,十六进制是 9
A 的二进制是 A ,八进制是 A ,十六进制是 A
BB 的二进制是 BB ,八进制是 BB ,十六进制是 BB
100 的二进制是 1100100 ,八进制是 144 ,十六进制是 64

转换只能在元素进行,如果对整个数组进行转换,则原封不动返回该数组

toLocaleString

返回本地格式字符串,主要用在Date对象上

var a = new Date();
document.write(a.toString());  // -> Sat Aug 8 17:28:36 UTC+0800  2009
document.write(a.toLocaleString());  // -> 2009年8月8日 17:28:36
document.write(a.toLocaleDateString());  // -> 2009年8月8日

区别在于,toString()返回标准格式,toLocaleString()返回本地格式完整日期(在【控制面板】>>【区域和语言选项】,通过修改[时间]和[长日期]格式),toLocaleDateString()跟toLocaleString()一样,只是少了时间

valueOf

根据不同对象返回不同原始值,用于输出的话跟toString()差不多,但是toString()是返回string类型,而valueOf()是返回原对象类型

var a = [1,2,3,[4,5,6,[7,8,9]]];
var b = new Date();
var c = true;
var d = function(){
alert("sunnycat");
};
document.write(a.valueOf());  // -> 1,2,3,4,5,6,7,8,9
document.write(typeof (a.valueOf())); // -> object
document.write(b.valueOf());  // -> 1249874470052
document.write(typeof(b.valueOf())); // -> number
document.write(c.valueOf());  // -> true
document.write(typeof(c.valueOf())); // -> boolean
document.write(d.valueOf());  // -> function () {  alert("sunnycat"); }
document.write(typeof(d.valueOf())); // -> function

数组也是对象,所以typeof (a.valueOf())返回object,返回的依然是个多维数组

var a = [1,2,3,[4,5,6,[7,8,9]]];
var aa = a.valueOf();
document.write(aa[3][3][1]); // -> 8

Date对象返回的是距离1970年1月1日的毫秒数,
Math和Error对象没有valueOf方法

Jquery 数组操作

在jquery中处理JSON数组的情况中遍历用到的比较多,但是用添加移除这些好像不是太多。
今天试过json[i].remove(),json.remove(i)之后都不行,看网页的DOM对象中好像JSON数据是以数组的形式出现的,查阅了下相关JS中数组的操作一试果然很爽。
记录下来。

1、数组的创建

var arrayObj = new Array(); //创建一个数组
var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度
var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]); 创建一个数组并赋值

    要说明的是,虽然第二种方法创建数组指定了长度,但实际上所有情况下数组都是变长的,也就是说即使指定了长度为5,仍然可以将元素存储在规定长度以外的,注意:这时长度会随之改变。

2、数组的元素的访问

var testGetArrValue=arrayObj[1]; //获取数组的元素值
arrayObj[1]= "这是新值"; //给数组元素赋予新的值

3、数组元素的添加

arrayObj. push([item1 [item2 [. . . [itemN ]]]]);// 将一个或多个新元素添加到数组结尾,并返回数组新长度
arrayObj.unshift([item1 [item2 [. . . [itemN ]]]]);// 将一个或多个新元素添加到数组开始,数组中的元素自动后移,返回数组新长度
arrayObj.splice(insertPos,0,[item1[, item2[, . . . [,itemN]]]]);//将一个或多个新元素插入到数组的指定位置,插入位置的元素自动后移,返回""

4、数组元素的删除

arrayObj.pop(); //移除最后一个元素并返回该元素值
arrayObj.shift(); //移除最前一个元素并返回该元素值,数组中元素自动前移
arrayObj.splice(deletePos,deleteCount); //删除从指定位置deletePos开始的指定数量deleteCount的元素,数组形式返回所移除的元素

5、数组的截取和合并

arrayObj.slice(start, [end]); //以数组的形式返回数组的一部分,注意不包括 end 对应的元素,如果省略 end 将复制 start 之后的所有元素
arrayObj.concat([item1[, item2[, . . . [,itemN]]]]); //将多个数组(也可以是字符串,或者是数组和字符串的混合)连接为一个数组,返回连接好的新的数组

6、数组的拷贝

arrayObj.slice(0); //返回数组的拷贝数组,注意是一个新的数组,不是指向
arrayObj.concat(); //返回数组的拷贝数组,注意是一个新的数组,不是指向

7、数组元素的排序
arrayObj.reverse(); //反转元素(最前的排到最后、最后的排到最前),返回数组地址
arrayObj.sort(); //对数组元素排序,返回数组地址

8、数组元素的字符串化

arrayObj.join(separator); //返回字符串,这个字符串将数组的每一个元素值连接在一起,中间用 separator 隔开。
toLocaleString 、toString 、valueOf:可以看作是join的特殊用法,不常用

更多JavaScript jQuery 中定义数组与操作及jquery数组操作相关文章请关注PHP中文网!


Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn