web-dev-qa-db-ja.com

配列の最初の要素を取得

配列から最初の要素を取得する方法

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];

私はこれを試しました:

alert($(ary).first());

しかし、それは[object Object]を返します。

そのため、配列から最初の要素を取得する必要があります。これは、要素firstです。

171
MacMac

このような

alert(ary[0])
272
John Hartsock

なぜあなたはVanilla JavaScript配列をjQueryに慣れさせているのですか?標準のJavaScriptを使用してください。

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];
alert(ary[0]);

https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array

また、 needs more jQuery

出典bobince の好意により

188
Matt Ball

さまざまな状況のための下記の方法のいくつか。

ほとんどの場合、最初の要素にアクセスする最も簡単な方法は次のとおりです。

yourArray[0]

しかし、これは[0]が実際に存在するかどうかを確認する必要があります。

元の配列を気にしないで、インデックスが存在するかどうかをチェックしたくない、最初の要素を取得したい、または未定義のインラインを取得したいというような、現実世界の場合があります。

この場合、最初の要素を取得するために shift() メソッドを使用できますが、このメソッドは元の配列を変更することに注意してください(最初の項目を削除します)そしてそれを返します。したがって、配列の長さは1つ短くなります。このメソッドは、最初の要素を取得するだけでよい場合はインラインの場合に使用できますが、元の配列は気にしないでください。

yourArray.shift()

知っておくべき重要なことは、配列が[0]インデックスで始まる場合、上記の2つはオプションにすぎないということです。

最初の要素が削除されている場合があります。例えば、delete yourArray [0]を使用すると、配列に "holes"が残ります。 [0]の要素は未定義ですが、最初の "existing"要素を取得したいとします。私はこれについて多くの実例を見ました。

そのため、配列と最初のキーに関する知識がない(または穴があることがわかっている)と仮定すると、最初の要素を取得できます。

最初の要素を取得するには、 find() を使用します。

Find()の利点は、条件を満たす最初の値に達したときにループから出るための効率です(詳細は後述)。 (条件をカスタマイズして、nullまたは他の空の値も除外できます)

var firstItem = yourArray.find(x=>x!==undefined);

また、最初にコピー内の配列を「修正」してから最初の要素を取得するためのオプションとして、 filter() を含めるようにします。元の配列はそのまま(変更されていない)。

ここにfilter()を含めるもう1つの理由は、それがfind()の前に存在し、多くのプログラマがすでにそれを使用しているからです(find()がES6であるのに対してES5です)。

var firstItem = yourArray.filter(x => typeof x!==undefined).shift();

Filter()は実際には効率的な方法ではなく(filter()がすべての要素を処理する)、別の配列を作成することに注意してください。たとえば、forEachを使用した場合のように、パフォーマンスへの影響はごくわずかであるため、小さいアレイで使用することをお勧めします。

(最初の要素を取得するためにfor ... inループを使用することをお勧めする人もいますが、 for ... inは使用しないでください。インデックスの順序が重要な配列 を反復処理するために使用されます。ブラウザはほとんど順序を尊重することができますが、順序を保証するわけではありません。あなたはそれを破ることができず、それがすべての要素を通過するので、多くの人が提案するように、単純なforループを使用してkey/value をチェックすることによって得策です。

Find()とfilter()はどちらも要素の順序を保証するため、上記のように安全に使用できます。

52
Selay

最初の要素が削除されている場合、インデックス0の要素は存在しない可能性があります。

let a = ['a', 'b', 'c'];
delete a[0];

for (let i in a) {
  console.log(i + ' ' + a[i]);
}

JQueryなしで最初の要素を取得するためのより良い方法:

function first(p) {
  for (let i in p) return p[i];
}

console.log( first(['a', 'b', 'c']) );
46
NicoLwk

読みやすさを保持したい場合は、常に最初の関数をArray.protoypeに追加することができます。

Array.prototype.first = function () {
    return this[0];
};

Aそれからあなたは簡単に最初の要素を取得することができます:

[1, 2, 3].first();
> 1
41
eliocs

ES6デストラクタを使用する

let [first] = [1,2,3];

どれが同じです

let first = [1,2,3][0];
28
Flavien Volken

あなたの配列がインデックス0から生成されることが保証されていない場合は、Array.prototype.find()を使うことができます。

var elements = []
elements[1] = 'foo'
elements[2] = 'bar'

var first = function(element) { return !!element }    
var gotcha = elements.find(first)

console.log(a[0]) // undefined
console.log(gotcha) // 'foo'
18
thomax
array.find(e => !!e);  // return the first element 

「find」はフィルターに一致する最初の要素を返すため、&& !!eは任意の要素に一致します。

これは、最初の要素が「偽」でない場合にのみ機能します:nullfalseNaN""0undefined

14
Abdennour TOUMI

alert(ary[0]);を試してください。

9
thejh

次のようにできます:

let first = array.find(Boolean);

または、onlyだけが気になる場合真の要素:

let first = array.find(e => e);

読みやすさを気にしながら、数値の発生に依存しないfirst()-を追加しました Array.protoype への関数 Object​.define​Property() で定義することにより組み込みArrayオブジェクトのプロトタイプを修正する際の落とし穴を軽減します直接( ここで説明 )。

パフォーマンスはかなり良好です(find()は最初の要素の後に停止します)が、完全ではないか、一般にアクセスできません(ES6のみ)。より多くの背景については @ Selays answer を読んでください。

Object.defineProperty(Array.prototype, 'first', {
  value() {
    return this.find(Boolean);     // or this.find(e => e)
  }
});

次に、最初の要素を取得するために次のことができます。

let array = ['a', 'b', 'c'];
array.first();

> 'a'

動作を確認するためのスニペット:

Object.defineProperty(Array.prototype, 'first', {
  value() {
    return this.find(Boolean);
  }
});

console.log( ['a', 'b', 'c'].first() );
8
MiXT4PE

は配列で動作し、それはオブジェクトでも動作するメソッド(注意してください) 、オブジェクトは保証された順序を持っていません!).

元の配列は変更されないので、私はこの方法を最も好みます。

// In case of array
var arr = [];
arr[3] = 'first';
arr[7] = 'last';
var firstElement;
for(var i in arr){
    firstElement = arr[i];
    break;
}
console.log(firstElement);  // "first"

// In case of object
var obj = {
    first: 'first',
    last: 'last',
};

var firstElement;

for(var i in obj){
    firstElement = obj[i];
    break;
}

console.log(firstElement) // First;
7

Underscore.js( http://underscorejs.org/ )を使用している場合にのみ、次のことが可能です。

_.first(your_array);
7
pastullo

私は、他の言語からJavaScriptに至る人々が、配列の最初の要素を取得するためにhead()first()のようなものを探しているのを知っていますが、どうすればいいのでしょうか。

以下の配列があるとします。

const arr = [1, 2, 3, 4, 5];

JavaScriptでは、単純に次のことができます。

const first = arr[0];

あるいは、もっと簡単で新しい方法は、

const [first] = arr;

しかし、単純に関数を書くこともできます。

function _first(arr) {
   if(!Array.isArray(arr)) return;
   return arr[0];
}

アンダースコアを使用している場合は、探しているものと同じ機能を果たす関数のリストがあります。

_.first 

_.head

_.take
5
Alireza

複数の一致がある場合、JQueryの.first()は、jqueryに与えられたCSSセレクタに一致した最初のDOM要素を取得するために使用されます。

JavaScriptの配列を操作するのにjQueryは必要ありません。

4
letronje

フィルタを使用して配列の最初の要素を見つけます。

function first<T>(arr: T[], filter: (v: T) => boolean): T {
    let result: T;
    return arr.some(v => { result = v; return filter(v); }) ? result : undefined;
}

普通のJavaScriptでは:

function first(arr, filter) {
    var result;
    return arr.some(function (v) { result = v; return filter(v); }) ? result : undefined;
}

そして同様に、indexOf:

TypeScriptの場合:

function indexOf<T>(arr: T[], filter: (v: T) => boolean): number {
    let result: number;
    return arr.some((v, i) => { result = i; return filter(v); }) ? result : undefined;
}

普通のJavaScriptでは:

function indexOf(arr, filter) {
    var result;
    return arr.some(function (v, i) { result = i; return filter(v); }) ? result : undefined;
}
4
Corey Alix

配列が空になる可能性がある時間を考慮しないのはなぜですか。

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];
first = (array) => array.length ? array[0] : 'no items';
first(ary)
// output: first

var ary = [];
first(ary)
// output: no items
2
NathanQ

.get(0)を使うこともできます。

alert($(ary).first().get(0));

配列の最初の要素を取得します。

2

ES2015以降では、配列デストラクタを使用して

const arr = [42, 555, 666, 777]
const [first] = arr
console.log(first)
2
Vik

前の例は、配列インデックスがゼロから始まるときにうまく機能します。 thomaxの答え はゼロから始まるインデックスに頼っていませんでしたが、私がアクセスできないArray.prototype.findに頼りました。次の jQuery $ .each を使用した解決策は、私の場合はうまくいきました。

let haystack = {100: 'first', 150: 'second'},
    found = null;

$.each(haystack, function( index, value ) {
    found = value;  // Save the first array element for later.
    return false;  // Immediately stop the $.each loop after the first array element.
});

console.log(found); // Prints 'first'.
1
Matthew

これを使用して、JavaScriptの文字を分割します。

var str = "boy, girl, dog, cat";
var arr = str.split(",");
var fst = arr.splice(0,1).join("");
var rest = arr.join(",");
1
Mohit Singh

真実の要素のみに関心がある人のためのもう一つ

ary.find(Boolean);
1
Vinnie
var ary = ['first', 'second', 'third', 'fourth', 'fifth'];

console.log(Object.keys(ary)[0]);

任意のObject配列(req)を作成してから、単にObject.keys(req)[0]を実行してObject配列の最初のキーを選択します。

0
Anuga

あなたが配列にビュー関数を連鎖しているならば。

array.map(i => i+1).filter(i => i > 3)

そして、これらの関数の後の最初の要素が欲しいなら、単に.shift()を追加すれば、元のarrayを変更することはできません。array.map(i => i+1).filter(=> i > 3)[0]より良い方法です。

オリジナルを変更せずに配列の最初の要素が欲しい場合は、array[0]またはarray.map(n=>n).shift()を使用することができます(マップなしでオリジナルを変更します。この場合は、..[0]バージョンを推奨します。

0

lodash_.headで簡単にできます。

var arr = ['first', 'second', 'third', 'fourth', 'fifth'];
console.log(_.head(arr));
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
0
Penny Liu

プロトタイプを宣言して、最初の配列の要素を次のようにします。

Array.prototype.first = function () {
   return this[0];
};

それからそれを使う:

var array = [0, 1, 2, 3];
var first = array.first();
var _first = [0, 1, 2, 3].first();

あるいは単純に(:

first = array[0];
0
ozhanli
var ary = ['first', 'second', 'third', 'fourth', 'fifth'];
alert(Object.values(ary)[0]);
0
Merak Marey

ary.slice(0,1).pop();を使うだけ

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];

console.log("1º "+ary.slice(0,1).pop());
console.log("2º "+ary.slice(0,2).pop());
console.log("3º "+ary.slice(0,3).pop());
console.log("4º "+ary.slice(0,4).pop());
console.log("5º "+ary.slice(0,5).pop());
console.log("Last "+ary.slice(-1).pop());

array.slice(START、END).pop();

0
Guilherme HS

@thomaxの答えはかなり良いのですが、配列の最初の要素がfalseまたはfalse-y(0、空文字列など)の場合は失敗します。未定義以外のものに対してはtrueを返すほうがよいでしょう。

const arr = [];
arr[1] = '';
arr[2] = 'foo';

const first = arr.find((v) => { return (typeof v !== 'undefined'); });
console.log(first); // ''
0
derikb

@NicoLwkスプライスで要素を削除する必要があります、それはあなたの配列を後ろにシフトします。そう:

var a=['a','b','c'];
a.splice(0,1);
for(var i in a){console.log(i+' '+a[i]);}
0
asinino