ホームページ ウェブフロントエンド jsチュートリアル Javascript配列の基礎入門_基礎知識

Javascript配列の基礎入門_基礎知識

May 16, 2016 pm 03:10 PM

JavaScript は魔法の言語であり、その配列も同様にユニークです。余分なものを取り除き、本質を抽出し、一般的に使用されるベスト プラクティスをまとめます。間違いがあればご指摘ください。

JavaScript 配列は、オブジェクトの特性を持つ配列のようなオブジェクトです。プロパティ名が小さい連続した整数の場合は、配列を使用する必要があります。それ以外の場合は、オブジェクトを使用する必要があります。

配列ソース

すべての配列は Array から構築されます。コンストラクター プロパティをテストしてみましょう。

var arr = [];
arr.constructor === Array; // true
arr.constructor === Array.prototype.constructor; // true
ログイン後にコピー

配列の作成

//数组字面量方式
var arr1 = [1, 2, 3]; // [1,2,3]

//构造函数方式
var arr2 = new Array();    // [] 空数组
var arr3 = new Array('9');   // ["9"] 一个字符串元素
var arr4 = new Array(9);    // [] 数组长度length为9
var arr5 = new Array([9]);   // [[9]] 相当于二维数组
var arr6 = new Array(1, 2, 3); // [1, 2, 3]
var arr7 = new Array(1, function f(){}, {o : 6}, null,undefined,true);
// 数组可以存储任意混合数据类型

ログイン後にコピー

arr4 の動作方法により、数値パラメーターが 1 つだけ Array コンストラクターに渡されると、コンストラクターは長さ属性が設定された空の配列を返します。したがって、短くて簡潔な配列リテラル方式を使用することをお勧めします。

オブジェクトが配列であるかどうかを検出します

var arr1 = [1, 2, 3];
typeof(arr1); // object
ログイン後にコピー

typeof が型を正しく検出しないことはよく知られています。

arr1 instanceof Array; //true
ログイン後にコピー

Web ページ内では、instanceof メソッドは問題ありませんが、他の Web ページをネストすると、グローバル スコープが 2 つになり、相互に呼び出す際の検出に問題が発生します。

Array.isArray(arr1); // true
ログイン後にコピー

Array.isArray() は ECMAScript5 の新しいメソッドであり、欠陥はありません。唯一の問題は、IE8 ブラウザーがこれをサポートしておらず、IE9 ブラウザーが厳密モードでサポートしていないことです。

Object.prototype.toString.apply(arr1).slice(8, -1); // Array
ログイン後にコピー

最後の方法は、タイプを検出する最良の方法です。

配列の長さ

配列の長さもその属性です。長さを増やしても範囲外エラーは発生しません。
長さの値は、配列の最大の整数の属性名に 1 を加えたものと等しくなります。

var arr1 = [];
arr1[9] = 1; // 长度为10,只包含一个元素的数组
ログイン後にコピー

名前が長さ以上の属性を削除するには、小さな値を設定します。
長さの値が 0 に設定されている場合、それは配列をクリアすることと同じです。

var arr2 = [1, 2, 3, 4, 5];
arr2.length = 3; // [1, 2, 3]
arr2.length = 0; // []
ログイン後にコピー

配列トラバーサル

配列を走査する場合、配列を走査するために for in ループを使用しないでください。for in はプロトタイプ チェーン上のすべてのプロパティを走査しますが、それほど多くのプロパティは必要ありません。 for ループを使用することをお勧めします。

var arr1 = [1, 2, 3];
arr1.test = 9;

//for in 方式
for(var prop in arr1){
  cosole.log(prop, arr1[prop]);
}
// 输出如下
// 0 1
// 1 2
// 2 3
// test 9

//for循环方式
for(var i = 0, len = arr1.length; i < len; i++){
  console.log(arr1[i]);
}
//输出如下
// 1
// 2
// 3

ログイン後にコピー

for in メソッドには余分なテスト値があり、hasOwnProperty 関数を使用して削除できることがわかりますが、これは for ループ メソッドよりもはるかに遅くなります。
配列の長さのキャッシュは必要な手順であり、アクセスごとにパフォーマンスのオーバーヘッドが発生します (最新のブラウザーはこの側面を最適化しています)。

概要

配列の基本知識を簡単に紹介します。この時点で、配列をより包括的に理解できます。次の記事では Array メソッドを紹介します。

JavaScript は理解するのが容易ではない側面がたくさんありますが、長い期間の学習を通じて、私は徐々に Javascript に夢中になってきました (今は愛する女の子がいないため)。

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

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

独自のJavaScriptライブラリを作成および公開するにはどうすればよいですか? 独自のJavaScriptライブラリを作成および公開するにはどうすればよいですか? Mar 18, 2025 pm 03:12 PM

記事では、JavaScriptライブラリの作成、公開、および維持について説明し、計画、開発、テスト、ドキュメント、およびプロモーション戦略に焦点を当てています。

ブラウザでのパフォーマンスのためにJavaScriptコードを最適化するにはどうすればよいですか? ブラウザでのパフォーマンスのためにJavaScriptコードを最適化するにはどうすればよいですか? Mar 18, 2025 pm 03:14 PM

この記事では、ブラウザでJavaScriptのパフォーマンスを最適化するための戦略について説明し、実行時間の短縮、ページの負荷速度への影響を最小限に抑えることに焦点を当てています。

フロントエンドのサーマルペーパーレシートのために文字化けしたコード印刷に遭遇した場合はどうすればよいですか? フロントエンドのサーマルペーパーレシートのために文字化けしたコード印刷に遭遇した場合はどうすればよいですか? Apr 04, 2025 pm 02:42 PM

フロントエンドのサーマルペーパーチケット印刷のためのよくある質問とソリューションフロントエンド開発におけるチケット印刷は、一般的な要件です。しかし、多くの開発者が実装しています...

ブラウザ開発者ツールを使用してJavaScriptコードを効果的にデバッグするにはどうすればよいですか? ブラウザ開発者ツールを使用してJavaScriptコードを効果的にデバッグするにはどうすればよいですか? Mar 18, 2025 pm 03:16 PM

この記事では、ブラウザ開発者ツールを使用した効果的なJavaScriptデバッグについて説明し、ブレークポイントの設定、コンソールの使用、パフォーマンスの分析に焦点を当てています。

誰がより多くのPythonまたはJavaScriptを支払われますか? 誰がより多くのPythonまたはJavaScriptを支払われますか? Apr 04, 2025 am 12:09 AM

スキルや業界のニーズに応じて、PythonおよびJavaScript開発者には絶対的な給与はありません。 1. Pythonは、データサイエンスと機械学習でさらに支払われる場合があります。 2。JavaScriptは、フロントエンドとフルスタックの開発に大きな需要があり、その給与もかなりです。 3。影響要因には、経験、地理的位置、会社の規模、特定のスキルが含まれます。

ソースマップを使用して、マイナイドJavaScriptコードをデバッグするにはどうすればよいですか? ソースマップを使用して、マイナイドJavaScriptコードをデバッグするにはどうすればよいですか? Mar 18, 2025 pm 03:17 PM

この記事では、ソースマップを使用して、元のコードにマッピングすることにより、Minified JavaScriptをデバッグする方法について説明します。ソースマップの有効化、ブレークポイントの設定、Chrome DevtoolsやWebpackなどのツールの使用について説明します。

Console.log出力の違い結果:なぜ2つの呼び出しが異なるのですか? Console.log出力の違い結果:なぜ2つの呼び出しが異なるのですか? Apr 04, 2025 pm 05:12 PM

Console.log出力の違いの根本原因に関する詳細な議論。この記事では、Console.log関数の出力結果の違いをコードの一部で分析し、その背後にある理由を説明します。 �...

初心者向けのタイプスクリプト、パート2:基本データ型 初心者向けのタイプスクリプト、パート2:基本データ型 Mar 19, 2025 am 09:10 AM

エントリーレベルのタイプスクリプトチュートリアルをマスターしたら、TypeScriptをサポートするIDEで独自のコードを作成し、JavaScriptにコンパイルできるはずです。このチュートリアルは、TypeScriptのさまざまなデータ型に飛び込みます。 JavaScriptには、NULL、未定義、ブール値、数字、文字列、シンボル(ES6によって導入)とオブジェクトの7つのデータ型があります。 TypeScriptはこれに基づいてより多くのタイプを定義し、このチュートリアルではすべてを詳細に説明します。 ヌルデータ型 JavaScriptのように、Typescriptのnull

See all articles