Lấy ra phần tử đầu tiên trong mảng javascript

answer

256

256 hữu ích 5 bình luận chia sẻ

answer

183

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

183 hữu ích 2 bình luận chia sẻ

answer

46

Phần tử chỉ mục 0 có thể không tồn tại nếu phần tử đầu tiên đã bị xóa
Chứng minh nó trong bảng điều khiển trình duyệt của bạn:

var a=['a','b','c'];
delete a[0];
for(var 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(var i in p)return p[i];}
first(a);

46 hữu ích 3 bình luận chia sẻ

answer

45

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 dưới dạng 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 so vớ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 khuyên nên sử dụng for ... in loop để lấy phần tử đầu tiên, nhưng tôi khuyên bạn nên dùng phương thức này vì ... không nên sử dụng để lặp qua một mảng trong đó thứ tự chỉ mục rất quan trọng vì nó không quan trọ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 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ố. cho 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.

45 hữu ích 5 bình luận chia sẻ

answer

41

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

41 hữu ích 5 bình luận chia sẻ

answer

26

Sử dụng phá hủy ES6

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

Giống như

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

26 hữu ích 0 bình luận chia sẻ

answer

17

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'

17 hữu ích 3 bình luận chia sẻ

answer

13

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 && !!ekhớ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

13 hữu ích 5 bình luận chia sẻ

answer

9

9 hữu ích 1 bình luận chia sẻ

answer

7

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

7 hữu ích 0 bình luận chia sẻ

answer

6

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ó một trật 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;

6 hữu ích 0 bình luận chia sẻ

answer

5

Tôi biết rằng những người đến từ các ngôn ngữ khác với JavaScript, đang tìm kiếm thứ gì đó giống như head()hoặc first()để 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

5 hữu ích 0 bình luận chia sẻ

answer

4

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.

4 hữu ích 0 bình luận chia sẻ

answer

4

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

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

4 hữu ích 0 bình luận chia sẻ

answer

2

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.

2 hữu ích 0 bình luận chia sẻ

answer

2

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)

2 hữu ích 0 bình luận chia sẻ

answer

1

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

1 hữu ích 0 bình luận chia sẻ

answer

1

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

1 hữu ích 0 bình luận chia sẻ

answer

1

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>

1 hữu ích 0 bình luận chia sẻ

answer

0

@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]);}

0 hữu ích 1 bình luận chia sẻ

answer

0

Sử dụng điều này để phân chia ký tự trong javascript.

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

0 hữu ích 0 bình luận chia sẻ

answer

0

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

0 hữu ích 0 bình luận chia sẻ

answer

0

Nếu bạn đang kết nối một chức năng xem với 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, đó là cách tốt hơn sau đóarray.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.

0 hữu ích 0 bình luận chia sẻ

answer

0

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

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

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

0 hữu ích 1 bình luận chia sẻ

answer

0

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

0 hữu ích 0 bình luận chia sẻ

answer

0

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

0 hữu ích 0 bình luận chia sẻ

answer

1

ES6 dễ dàng:

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

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

1 hữu ích 3 bình luận chia sẻ