배열의 첫 번째 요소를 얻는 방법?

다음과 같이 배열에서 첫 번째 요소를 얻는 방법은 무엇입니까?

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

나는 이것을 시도했다 :

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

그러나 그것은 돌아올 것이다 [object Object]. 따라서 배열에서 첫 번째 요소를 가져와야 'first'합니다.

이처럼

alert(ary[0])

왜 바닐라 JavaScript 배열을 jQuery로 수정합니까? 표준 JavaScript를 사용하십시오!

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

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

또한,

소스 , 보 빈스의 의례

다른 상황에 따라 아래의 몇 가지 방법이 있습니다.

대부분의 경우 첫 번째 요소에 액세스하는 가장 간단한 방법은

yourArray[0]

그러나 [0]이 실제로 존재하는지 확인해야합니다.

실제 배열에 신경 쓰지 않고 색인이 존재하는지 확인하고 싶지 않은 경우 첫 번째 요소 또는 정의되지 않은 인라인을 얻으려는 실제 사례가 있습니다.

이 경우 shift () 메서드를 사용 하여 첫 번째 요소를 가져올 수 있지만이 메서드는 원래 배열을 수정하고 첫 번째 항목을 제거하고 반환해야합니다. 따라서 배열의 길이는 1 씩 줄어 듭니다. 이 방법은 첫 번째 요소를 가져와야하는 인라인 경우에 사용할 수 있지만 원래 배열은 신경 쓰지 않습니다.

yourArray.shift()

알아야 할 중요한 사항은 배열이 [0] 인덱스로 시작하는 경우 위의 두 옵션 만 옵션이라는 것입니다.

첫 번째 요소가 삭제 된 경우가 있는데, 예를 들어 yourArray [0]을 삭제하면 배열에 "구멍"이 남습니다. 이제 [0]의 요소는 정의되지 않았지만 첫 번째 "기존"요소를 가져 오려고합니다. 나는 이것에 대한 많은 실제 사례를 보았습니다.

따라서 배열과 첫 번째 키에 대한 지식이 없거나 첫 번째 키를 알고 있다고 가정하면 여전히 첫 번째 요소를 얻을 수 있습니다.

find () 를 사용 하여 첫 번째 요소를 얻을 수 있습니다 .

find ()의 장점은 조건을 만족하는 첫 번째 값에 도달하면 루프를 빠져 나가는 효율성입니다 (자세한 내용은 아래 참조). (널 또는 다른 빈 값도 제외하도록 조건을 사용자 정의 할 수 있습니다)

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

또한 filter ()를 여기에 먼저 복사에서 배열을 "수정"하고 원래 배열을 그대로 유지하면서 첫 번째 요소를 가져 오는 옵션으로 포함하고 싶습니다 .

여기에 filter ()를 포함시키는 또 다른 이유는 find () 이전에 존재했으며 많은 프로그래머가 이미 사용하고 있기 때문입니다 (find ()에 대한 ES5는 ES6 임).

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

filter ()는 실제로 효율적인 방법은 아니며 (filter ()가 모든 요소를 ​​통해 실행 됨) 다른 배열을 만듭니다. 예를 들어 forEach를 사용하는 경우 성능에 미치는 영향이 미미하므로 소규모 어레이에서 사용하는 것이 좋습니다.

(나는 어떤 사람들은 첫 번째 요소를 얻기 위해 루프를 위해 ... 사용하는 것이 좋습니다 볼 수 있지만, 나는이 방법에 대해 추천 을 위해 ... 배열을 통해 반복 사용하지 않아야의 인덱스 순서가 중요한 경우 는 아무튼 때문에 ' 브라우저가 대부분의 순서를 존중한다고 주장 할 수는 있지만 순서를 보장하지는 않지만 forEach는 문제를 해결할 수 없기 때문에 많은 제안 된 문제를 해결하지 못하며 모든 요소를 ​​통과하게됩니다. 루프 및 키 / 값 확인

find ()와 filter ()는 요소의 순서를 보장하므로 위와 같이 사용하는 것이 안전합니다.

첫 번째 요소가 삭제 된 경우 인덱스 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']) );

ES6 파괴 사용

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

어느 것과

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

가독성 을 유지하려면 항상 첫 번째 함수를 Array.protoype:

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

그런 다음 첫 번째 요소를 쉽게 검색 할 수 있습니다.

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

당신은 그냥 사용할 수 있습니다 find() :

let first = array.find(Boolean);

또는 거짓 인 경우 에도 첫 번째 요소를 원하는 경우 :

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

추가 마일로 이동 :

가독성에 관심이 있지만 숫자 발생에 의존하고 싶지 않다면 내장 Array 객체 프로토 타입을 직접 수정하는 함정을 완화시키는 기능 을 정의 first()하여 추가 할 수 있습니다 ( 여기 설명 ).Array.protoypeObject​.define​Property()

성능은 꽤 좋지만 ( find()첫 번째 요소 다음에 멈춤) 완벽하거나 보편적으로 액세스 할 수있는 것은 아닙니다 (ES6 만 해당). 더 많은 배경을 보려면 @Selays answer를 읽으 십시오 .

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

그런 다음 첫 번째 요소를 검색하려면 다음을 수행하십시오.

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

> 'a'

실제로 볼 수있는 스 니펫 :

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

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

배열이 인덱스 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'

array.find(e => !!e);  // return the first element 

"find"는 필터와 일치하는 첫 번째 요소를 리턴하고 &&는 !!e모든 요소와 일치합니다.

참고 첫 번째 요소는 "Falsy"없는 경우에만 작동 : null, false, NaN, "", 0,undefined

시도하십시오 alert(ary[0]);.

underscore.js ( http://underscorejs.org/ )를 사용하는 경우에만 다음을 수행 할 수 있습니다.

_.first(your_array);

내가 좋아하는 뭔가를 찾고, 자바 스크립트로 다른 언어에서 오는 그 사람을 알 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

메소드는 배열과 작품 , 그리고 그것을 객체와 함께 작동 도 (주의, 객체는 보장 된 순서가 없습니다!).

원래 배열은 수정되지 않기 때문에이 방법을 가장 선호합니다.

// 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;

ES2015 이상에서는 배열 소멸을 사용합니다.

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

진실한 요소에만 관심이있는 사람들을위한 또 하나

ary.find(Boolean);

필터를 사용하여 배열에서 첫 번째 요소를 찾으십시오.

타이프 스크립트에서 :

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

일반 자바 스크립트에서 :

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

마찬가지로 indexOf :

타이프 스크립트에서 :

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;
}

일반 자바 스크립트에서 :

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

일치하는 항목이 여러 개인 경우 JQuery의 .first ()는 jquery에 제공된 CSS 선택기와 일치하는 첫 번째 DOM 요소를 가져 오는 데 사용됩니다.

자바 스크립트 배열을 조작하기 위해 jQuery가 필요하지 않습니다.

배열이 비어있는 시간을 고려해보십시오.

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

그냥 사용 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 ();

.get (0)을 사용할 수도 있습니다.

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

배열의 첫 번째 요소를 가져옵니다.

이것을 사용하여 문자를 자바 스크립트로 분할하십시오.

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

앞의 예제는 배열 인덱스가 0에서 시작할 때 잘 작동합니다. thomax의 답변 은 0에서 시작하는 색인에 의존 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'.

당신은 그것을 할 수 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>

@NicoLwk 스플 라이스로 요소를 제거하면 배열이 다시 이동합니다. 그래서:

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

첫 번째 배열 을 얻기 위해 프로토 타입 선언 요소 .

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];

뷰 함수를 배열에 연결하는 경우

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()맵을 사용하여 원본을 수정할 수 있습니다 .이 경우 btw ..[0]버전을 제안합니다 .

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

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

객체 배열 ( req)을 만든 다음 Object.keys(req)[0]객체 배열에서 첫 번째 키를 선택하기 만하면 됩니다.

@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); // ''

ES6 쉬움 :

let a = []
a[7] = 'A'
a[10] = 'B'

let firstValue = a.find(v => v)
let firstIndex = a.findIndex(v => v)