ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript の最も基本的なデータ構造-----配列

JavaScript の最も基本的なデータ構造-----配列

高洛峰
高洛峰オリジナル
2016-10-13 14:34:011034ブラウズ

1.1 Javascript における配列の定義

配列の標準定義: 格納された要素の線形コレクション。インデックスは通常、数値であり、要素間の格納場所のオフセットを計算するために使用されます。要素。
ただし、JavaScript の配列は特殊なオブジェクトであり、オフセットを表すために使用されるインデックスはオブジェクトのプロパティであり、インデックスは整数である場合があります。ただし、JavaScript オブジェクトのプロパティ名は文字列である必要があるため、これらの数値インデックスは内部で文字列型に変換されます。

2.2 配列を使用する

2.2.1 配列を作成する

var nums = [1,2,3,4] || この方法の方が効率的です

var nums = new Array(1,2,3,4); ;

2.2.2 配列の読み取りと書き込み

代入ステートメントでは、[] 演算子を使用してデータを配列に代入します。たとえば、次のループは 1 から 100 までの数値を配列に代入します。 [ ] 演算子は配列内の要素を読み取ります:

var nums = [];for (var i =0; i<100;i++){
    nums[i] = i+1;}

2.2.3 文字列から配列を生成する

var nums = [1,2,3,4];
var sum = nums[0]+nums[1]+nums[2]+nums[3];
console.log(sum)

上記のプログラムでは、splite() メソッドが呼び出され、文が と の部分に分割されて保存されます各部分を新しく作成された配列の要素として扱います。

2.2.4 配列の整合性に関する操作

1. ある配列を別の配列に代入します

var sentence = "the quick brown fox jumped over the lazy dog"; 
var  words = sentence.split(" ");
for (var  i=0; i<words.length;i++){
    console.log("word " + i + ":" +words[i]);
}

ただし、上記の代入操作は、割り当てられた配列に新しい参照を追加するだけです。元の参照を通じて配列の値が変更されると、他の参照も変更されます。

var nums = [];
for (var i = 0; i<10;i++){
    nums[i] = i+1;
}
var samenums = nums;

この動作は浅いコピーであり、新しい配列は依然として元の配列を指します。

より良い解決策は、元の配列の各要素を新しい配列にコピーする、ディープ コピーです。

var nums = [];
for (var i = 0; i<10;i++){
    nums[i] = i+1;
}
var samenums = nums;
nums[0] = 400;
console.log(samenums[0]);  //显示400

2.3 アクセス関数

2.3.1 Find element =====indexOf()

は、渡されたパラメータがターゲット配列に存在するかどうかを検索するために使用されます。ターゲット配列にこのパラメータが含まれている場合は、配列内の要素のインデックスが返されます。そうでない場合は、-1 が返されます。

2.3.2 配列の文字列表現 ===== join() および toString()

どちらのメソッドも、配列のすべての要素をカンマで区切って含む文字列を返します。

2.3.3 既存の配列から新しい配列を作成する =====concat() と splice()

concat() メソッドは、複数の配列をマージして新しい配列を作成できます。

splice() メソッドは、配列のサブセットをインターセプトして新しい配列を作成します。このメソッドの最初のパラメータはインターセプトの開始インデックスで、2 番目のパラメータはインターセプトの長さです。

//写个深复制函数function copy(arr1,arr2){
    for (var i = 0;i<arr1.length;i++){
        arr2[i] = arr1[i];
    }}var nums = [];for (var i = 0; i<10;i++){
    nums[i] = i+1;}var samenums = [];copy(nums,samenums);nums[0] = 400;console.log(samenums[0]);   //显示1

2.4 変数関数

2.4.1 配列に要素を追加======push() と unshift()

push() メソッドは、配列の末尾に要素を追加します。

unshift() メソッドは、配列の先頭に要素を追加できます。

var itDiv = ["Mike","Clayton","Terrill","Raymond","Cynthia","Danny","Jennifer"]; 
var dmpDept = itDiv.splice(3,3);  // Raymond,Cynthia,Danny print(cisDept);
var cisDept = itDiv; 
console.log(dmpDept);// Mike,Clayton,Terrill,Jennifer

2.4.2 配列からの要素の削除pop()とshift()

pop()メソッドは配列の末尾の要素を削除できます。

var nums = [2,3,4,5]; console.log(nums); // 2,3,4,5 var newnum = 1;
 nums.unshift(newnum); 
 console.log(nums); // 1,2,3,4,5 
 nums = [3,4,5];
  nums.unshift(newnum,1,2); 
  console.log(nums); // 1,2,3,4,5

shift() メソッドは配列の最初の要素を削除できます。

var nums = [9,1,2,3,4,5];
 nums.shift(); 
 console.log(nums); // 1,2,3,4,5

pop() 和 shift() 方法都将删掉的元素作为方法的 返回值返回,因此可以使用一个变量来保存删除的元素:

var nums = [6,1,2,3,4,5]; 
var first = nums.shift(); // first gets the value 9 
nums.push(first);
 console.log(nums); // 1,2,3,4,5,6

2.4.3 从数组中间位置添加和删除元素=====splice()

用splice()方法为数组添加元素,需提供如下参数:

起始索引(就是希望开始添加元素的地方)

需要删除的元素个数(添加元素时该参数设为0)

想要添加进数组的元素
such as:

var nums=[1,2,3,7,8,9];
var newElements = [4,5,6];
nums.splice(3,0,newElements);
console.log(nums);   //1,2,3,4,5,6,7,8,9

下面是用splice()删除数组元素的例子:

var nums = [1,2,3,100,200,4,5];
nums.splice(3,2);
console.log(nums);   //1,2,3,4,5

2.4.4 为数组排序

1.reverse() ====> 将数组中元素的顺序进行翻转

2.sort() ======>对字符型的元素按字典顺序进行排序

对于数字类型的元素,如果要用sort()排序,可以在调用方法时传入一个大小比较函数,排序时,sort()方法会根据该函数比较数组中两个元素的大小,来决定整个数组的顺序。

function compare(num1,num2){
return num1-num2;
}
var nums = [3,4,1,80,27];
nums.sort(compare);

sort()使用了compare()函数对数组按照数字大小进行排序,而不是按照字典顺序。

2.5 迭代器方法

2.5.1 不生成新数组的迭代器方法

1.forEach()

接受一个函数作为参数,并对数组中的每个元素使用该函数。

    function square(num){
      console.log(num,num*num);
    }
    var nums = [1,2,3,4,5,6];
    nums.forEach(square);

2.every()

接受一个返回值为布尔型的函数,对数组中的每个元素使用该函数。如果对于所有的元素,该函数都返回true,则该方法返回true。

function isEven(num){
    return num%2 == 0;
}
var nums = [2,4,6,8];
var even = nums.every(isEven);
if(even){
    console.log("all numbers are even");
}else{
    console.log("not all numbers are even");
}

可以改改数组里的元素试试。

3.some()

some() 方法也接受一个返回值为布尔类型的函数,只要有一个元素使得该函数返回 true, 该方法就返回 true.

function isEven(num) {   
     return num % 2 == 0;
      } 
 var nums = [1,2,3,4,5,6,7,8,9,10]; 
 var someEven = nums.some(isEven); 
 if (someEven) {    
        console.log("some numbers are even"); 
 } else {   
        console.log("no numbers are even");
   }
    nums = [1,3,5,7,9]; 
    someEven = nums.some(isEven); 
    if (someEven) {    
            console.log("some numbers are even");
     } else {    
          console.log("no numbers are even");}

4.reduce()

接受一个函数,返回一个值。该方法会从一个累加值开始,不断对累加值和 数组中的后续元素调用该函数,直到数组中的最后一个元素,最后返回得到的累加值。
下 面这个例子展示了如何使用 reduce() 方法为数组中的元素求和:

function add(runningTotal,currentValue){
    return runningTotal + currentValue;
}
var nums = [1,2,3,4,5,6];
var sum = nums.reduce(add);
console.log(sum);

reduce() 方法和 add() 函数一起,从左到右,依次对数组中的元素求和。
reduce() 方法也可以用来将数组中的元素连接成一个长的字符串:

function concat(accumulatedString,tiem){
    return accumulatedString + item;
}
var words = ["the ", "quick ","brown ", "fox "]; 
var sentence = words.reduce(concat);
console.log(sentence);

2.5.2 生成新数组的迭代器方法

1. map()

map() 和 forEach() 有点儿像,对 数组中的每个元素使用某个函数。两者的区别是 map() 返回一个新的数组,该数组的元素 是对原有元素应用某个函数得到的结果。

function curve(grade){
    return grade += 5;
}
var grades = [78,89,92,74];
var newgrades = grades.map(curve);
console.log(newgrades);  // 83,94,97,79

2. filter()

filter() 和 every() 类似,传入一个返回值为布尔类型的函数。和 every() 方法不同的是, 当对数组中的所有元素应用该函数,结果均为 true 时,该方法并不返回 true,而是返回 一个新数组,该数组包含应用该函数后结果为 true 的元素。

function passing(num) {    
        return num >= 60;
 } 
 var grades = []; 
 for (var i = 0; i < 20; ++i) {    
        grades[i] = Math.floor(Math.random() * 101); 
    }
 var passGrades = grades.filter(passing);
console.log("All grades: "); 
console.log(grades);
console.log("Passing grades: "); 
console.log(passGrades);


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事:JS共通検証REG次の記事:JS共通検証REG