Làm thế nào để có được phần tử đầu tiên của một mảng?

Làm thế nào để bạn có được phần tử đầu tiên từ một mảng như thế này:

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

Tôi đã thử điều này:

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

Nhưng nó sẽ trở lại [object Object]. Vì vậy, tôi cần phải lấy phần tử đầu tiên từ mảng nên là phần tử 'first'.

như thế này

alert(ary[0])

Tại sao bạn là jQuery-ifying một mảng JavaScript vanilla? Sử dụng JavaScript tiêu chuẩn!

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

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

Cũng thế,

Nguồn , lịch sự của bobince

Một số cách dưới đây cho các trường hợp khác nhau.

Trong hầu hết các trường hợp thông thường, cách đơn giản nhất để truy cập phần tử đầu tiên là

yourArray[0]

nhưng điều này đòi hỏi bạn phải kiểm tra xem [0] có thực sự tồn tại không.

Có những trường hợp trong thế giới thực mà bạn không quan tâm đến mảng ban đầu và không muốn kiểm tra xem chỉ mục có tồn tại hay không, bạn chỉ muốn lấy phần tử đầu tiên hoặc nội tuyến không xác định.

Trong trường hợp này, bạn có thể sử dụng phương thức shift () để lấy phần tử đầu tiên, nhưng hãy thận trọng rằng phương thức này sửa đổi mảng ban đầu (loại bỏ mục đầu tiên và trả về nó). Do đó, chiều dài của một mảng được giảm đi một. Phương pháp này có thể được sử dụng trong các trường hợp nội tuyến khi bạn chỉ cần lấy phần tử đầu tiên, nhưng bạn không quan tâm đến mảng ban đầu.

yourArray.shift()

Điều quan trọng cần biết là hai ở trên chỉ là một tùy chọn nếu mảng của bạn bắt đầu bằng chỉ mục [0].

Có những trường hợp phần tử đầu tiên đã bị xóa, ví dụ với, xóa yourArray [0] để lại mảng của bạn có "lỗ hổng". Bây giờ phần tử tại [0] đơn giản là không xác định, nhưng bạn muốn lấy phần tử "hiện có" đầu tiên. Tôi đã thấy nhiều trường hợp thực tế của điều này.

Vì vậy, giả sử chúng ta không có kiến ​​thức về mảng và khóa đầu tiên (hoặc chúng ta biết có lỗ hổng), chúng ta vẫn có thể có được phần tử đầu tiên.

Bạn có thể sử dụng find () để lấy phần tử đầu tiên.

Ưu điểm của find () là hiệu quả của nó khi thoát khỏi vòng lặp khi đạt được giá trị đầu tiên thỏa mãn điều kiện (chi tiết hơn về điều này bên dưới). (Bạn có thể tùy chỉnh điều kiện để loại trừ null hoặc các giá trị trống khác)

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

Tôi cũng muốn bao gồm bộ lọc () ở đây như là một tùy chọn để "sửa" mảng đầu tiên trong bản sao và sau đó lấy phần tử đầu tiên trong khi vẫn giữ nguyên mảng ban đầu (không thay đổi).

Một lý do khác để bao gồm bộ lọc () ở đây là nó tồn tại trước find () và nhiều lập trình viên đã sử dụng nó (đó là ES5 chống lại find () là ES6).

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

Cảnh báo rằng bộ lọc () không thực sự là một cách hiệu quả (bộ lọc () chạy qua tất cả các phần tử) và tạo ra một mảng khác. Nó là tốt để sử dụng trên các mảng nhỏ vì tác động hiệu suất sẽ là cận biên, gần hơn với việc sử dụng forEach, ví dụ.

(Tôi thấy một số người đề xuất sử dụng cho ... trong vòng lặp để có được phần tử đầu tiên, nhưng tôi khuyên bạn nên sử dụng phương thức này cho ... không nên được sử dụng để lặp qua một mảng trong đó thứ tự chỉ mục là quan trọng vì nó không ' Không đảm bảo trật tự mặc dù bạn có thể tranh luận các trình duyệt chủ yếu tôn trọng trật tự. Dù sao đi nữa, forEach không giải quyết được vấn đề như nhiều người đề xuất vì bạn không thể phá vỡ nó và nó sẽ chạy qua tất cả các yếu tố. vòng lặp và bằng cách kiểm tra khóa / giá trị

Cả find () và filter () đều đảm bảo thứ tự các phần tử, vì vậy an toàn để sử dụng như trên.

Phần tử của chỉ số 0 có thể không tồn tại nếu phần tử đầu tiên đã bị xóa:

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

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

Cách tốt hơn để có được phần tử đầu tiên mà không cần jQuery:

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

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

Sử dụng phá hủy ES6

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

Giống như

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

Nếu bạn muốn duy trì khả năng đọc, bạn luôn có thể thêm chức năng đầu tiên vào Array.protoype:

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

Sau đó, bạn có thể dễ dàng truy xuất phần tử đầu tiên:

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

Bạn chỉ có thể sử dụng find():

let first = array.find(Boolean);

Hoặc nếu bạn muốn phần tử đầu tiên thậm chí nếu nó là falsy :

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

Đi xa hơn:

Nếu bạn quan tâm đến khả năng đọc nhưng không muốn dựa vào các sự cố về số, bạn có thể thêm một first()chức năng Array.protoypebằng cách xác định nó Object​.define​Property()để giảm thiểu những cạm bẫy của việc sửa đổi nguyên mẫu đối tượng Array tích hợp ( giải thích tại đây ).

Hiệu suất khá tốt ( find()dừng sau phần tử đầu tiên) nhưng nó không hoàn hảo hoặc có thể truy cập toàn cầu (chỉ ES6). Để biết thêm thông tin, hãy đọc câu trả lời @Selays .

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

Sau đó, để lấy phần tử đầu tiên bạn có thể làm:

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

> 'a'

Đoạn trích để xem nó trong hành động:

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

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

Nếu mảng của bạn không được đảm bảo được điền từ chỉ số 0, bạn có thể sử dụng 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 

vì "find" trả về phần tử đầu tiên khớp với bộ lọc && !!e khớp với bất kỳ phần tử nào.

Lưu ý này chỉ hoạt động khi các yếu tố đầu tiên không phải là một "Falsy": null, false, NaN, "", 0,undefined

Hãy thử alert(ary[0]);.

Chỉ trong trường hợp bạn đang sử dụng underscore.js ( http://underscorejs.org/ ), bạn mới có thể làm:

_.first(your_array);

Tôi biết rằng những người từ các ngôn ngữ khác đến JavaScript, đang tìm kiếm một cái gì đó như head()hoặcfirst() để có được phần tử đầu tiên của một mảng, nhưng làm thế nào bạn có thể làm điều đó?

Hãy tưởng tượng bạn có mảng bên dưới:

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

Trong JavaScript, bạn chỉ cần làm:

const first = arr[0];

hoặc gọn gàng hơn, cách mới hơn là:

const [first] = arr;

Nhưng bạn cũng có thể chỉ cần viết một hàm như ...

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

Nếu sử dụng dấu gạch dưới, có danh sách các hàm thực hiện cùng một thứ bạn đang tìm kiếm:

_.first 

_.head

_.take

Phương thức hoạt động với mảng và nó cũng hoạt động với các đối tượng (coi chừng, các đối tượng không có thứ tự được bảo đảm!).

Tôi thích phương pháp này nhất, vì mảng ban đầu không được sửa đổi.

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

Trong ES2015 trở lên, sử dụng phá hủy mảng:

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

Một số khác cho những người chỉ quan tâm đến các yếu tố trung thực

ary.find(Boolean);

Tìm phần tử đầu tiên trong một mảng bằng bộ lọc:

Trong bản thảo:

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

Trong javascript đơn giản:

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

Và tương tự, indexOf:

Trong bản thảo:

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

Trong javascript đơn giản:

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

Khi có nhiều kết quả khớp, .first () của JQuery được sử dụng để tìm nạp phần tử DOM đầu tiên khớp với bộ chọn css được cung cấp cho jquery.

Bạn không cần jQuery để thao tác các mảng javascript.

Tại sao không tính đến số lần mảng của bạn có thể trống?

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

Chỉ dùng ary.slice(0,1).pop();

Trong

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());

mảng.slice (BẮT ĐẦU, KẾT THÚC) .pop ();

Bạn cũng có thể sử dụng .get (0):

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

Để có được phần tử đầu tiên của mảng.

Sử dụng điều này để phân chia nhân vật trong javascript.

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

Các ví dụ trước hoạt động tốt khi chỉ số mảng bắt đầu từ 0. Câu trả lời của thomax không dựa vào chỉ số bắt đầu từ 0, mà dựa vào Array.prototype.findđó tôi không có quyền truy cập. Giải pháp sau đây sử dụng jQuery $ .each hoạt động tốt trong trường hợp của tôi.

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'.

Bạn có thể làm điều đó bằng cách lodash _.head rất dễ dàng.

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 Bạn nên loại bỏ các phần tử bằng mối nối, điều này sẽ dịch chuyển mảng của bạn trở lại. Vì thế:

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

Khai báo một nguyên mẫu để có được phần tử mảng đầu tiên là:

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

Sau đó sử dụng nó như:

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

Hoặc đơn giản (:

first = array[0];

Nếu bạn đang xâu chuỗi một chức năng xem cho mảng, vd

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

Và muốn phần tử đầu tiên sau các hàm này, bạn có thể chỉ cần thêm phần tử .shift()không sửa đổi bản gốc array, cách này đẹp hơnarray.map(i => i+1).filter(=> i > 3)[0]

Nếu bạn muốn phần tử đầu tiên của một mảng mà không sửa đổi bản gốc bạn có thể sử dụng array[0]hoặc array.map(n=>n).shift()(không có bản đồ, bạn sẽ sửa đổi bản gốc. Trong trường hợp này btw tôi sẽ đề xuất ..[0]phiên bản.

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

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

Tạo bất kỳ mảng Object ( req) nào, sau đó chỉ cần làm Object.keys(req)[0]để chọn khóa đầu tiên trong mảng Object.

Câu trả lời của @thomax là khá tốt, nhưng sẽ thất bại nếu phần tử đầu tiên trong mảng là false hoặc false-y (0, chuỗi rỗng, v.v.). Tốt hơn là chỉ trả lại đúng cho bất cứ điều gì khác hơn là không xác định:

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

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

ES6 dễ dàng:

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

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