Hướng dẫn how to get object from arraylist in javascript - cách lấy đối tượng từ danh sách mảng trong javascript

Question

Tôi có một đối tượng chứa một danh sách mảng các đối tượng. Tôi muốn nhận được giá trị của một đối tượng trong danh sách mảng.

thí dụ

var data = { 
             items1: [{ id: 1, name: 'foo' }, { id: 2, name: 'bar' }], 
             items2: [{ id: 3, name: 'foo' }, { id: 4, name: 'bar' }] 
           };

Tôi đang cố gắng truy cập tên ID: 1 trong các mục danh sách mảng1.

Tôi nghĩ nó sẽ giống như

data['items1']['id'].name

Nhưng tôi nghĩ rằng tôi đang thiếu một cái gì đó. Bất cứ ai biết tôi có thể làm gì sai

Kelsadita

1.0288 Huy hiệu bạc21 Huy hiệu đồng8 silver badges21 bronze badges

Đã hỏi ngày 22 tháng 9 năm 2013 lúc 5:57Sep 22, 2013 at 5:57

Mã Junkiecode JunkieCode Junkie

7.43225 Huy hiệu vàng76 Huy hiệu bạc137 Huy hiệu đồng25 gold badges76 silver badges137 bronze badges

3

Đây là một đối tượng có 2 khóa (

data['items1']['id'].name

5 và

data['items1']['id'].name

6), cả hai đều là mảng. Trong mỗi mảng là các phần tử là các đối tượng, mỗi phần chứa 2 khóa (

data['items1']['id'].name

7 và

data['items1']['id'].name

8).

Để có được

data['items1']['id'].name

7 của phần tử đầu tiên của mảng

data['items1']['id'].name

5 bạn sẽ làm:

data.items1[0].id

mà sẽ trả lại

data.items1[0].id

1.

Nếu bạn muốn tìm kiếm đối tượng có tên 'Bar' trong

data['items1']['id'].name

6, bạn có thể làm một cái gì đó như:

function find(item, name) {
    //no such array
    if(!data[item])
        return;

    //search array for key
    var items = data[item];
    for(var i = 0; i < items.length; ++i) {
        //if the name is what we are looking for return it
        if(items[i].name === name)
            return items[i];
    }
}

var obj = find('items2', 'bar');
obj.id; //4
obj.name; //'bar'

Tôi rất khuyên bạn nên đọc về các đối tượng và mảng JavaScript.

Đã trả lời ngày 22 tháng 9 năm 2013 lúc 6:04Sep 22, 2013 at 6:04

2

Bạn chỉ có thể truy cập các mục mảng bằng chỉ mục số của họ. Ví dụ:

// The first item in the array
data['items1'][0].name
// The second
data['items1'][1].name

Nếu bạn muốn tra cứu bằng ID, bạn có thể tạo một chức năng nhỏ để làm điều đó cho bạn:

function getItemById(anArray, id) {
    for (var i = 0; i < anArray.length; i += 1) {
        if (anArray[i].id === id) {
            return anArray[i];
        }
    }
}

var theName = getItemById(data['items1'], 1).name;

Đã trả lời ngày 22 tháng 9 năm 2013 lúc 6:10Sep 22, 2013 at 6:10

JacksonjacksonJackson

8.8405 Huy hiệu vàng 50 Huy hiệu bạc72 Huy hiệu Đồng5 gold badges50 silver badges72 bronze badges

Vì các mục1 là mảng, bạn nên viết:

data.items1[0].name

Đập

Phù bằng vàng 142K1616 gold badges164 silver badges193 bronze badges

Đã trả lời ngày 22 tháng 9 năm 2013 lúc 6:03Sep 22, 2013 at 6:03

Janchajanchajancha

4.9231 Huy hiệu vàng23 Huy hiệu bạc39 Huy hiệu đồng1 gold badge23 silver badges39 bronze badges

4

Hãy thử điều này

data.items1[0].id

3

Đã trả lời ngày 22 tháng 9 năm 2013 lúc 6:01Sep 22, 2013 at 6:01

KelsaditakelsaditaKelsadita

1.0288 Huy hiệu bạc21 Huy hiệu đồng8 silver badges21 bronze badges

3

Bạn đã bao giờ bắt gặp một yêu cầu để tìm một đối tượng cụ thể trong một mảng đối tượng nhất định? Trong bài đăng này, chúng tôi sẽ khám phá nhiều cách khác nhau để tìm một đối tượng cụ thể trong một mảng JavaScript. Chúng ta hãy giả sử rằng chúng ta có một mảng như trong danh sách bên dưới và chúng ta cần tìm xem một đối tượng có ID id id 4 có tồn tại hay không:

    var tasks = [
                { 'Id': '1', 'Title': 'Go to Market 99', 'Status': 'done' },
                { 'Id': '2', 'Title': 'Email to manager', 'Status': 'pending' },
                { 'Id': '3', 'Title': 'Push code to GitHub', 'Status': 'done' },
                { 'Id': '4', 'Title': 'Go for running', 'Status': 'done' },
                { 'Id': '5', 'Title': 'Go to movie', 'Status': 'pending' },
    ];

Để tìm kiếm một đối tượng cụ thể, chúng tôi sẽ sử dụng phương thức tìm nguyên mẫu mảng. Điều này trả về một giá trị trên một tiêu chí nhất định, nếu không, nó trả về ’không xác định. Phải mất hai tham số, một hàm gọi lại bắt buộc và một đối tượng tùy chọn, sẽ được đặt làm giá trị của chức năng gọi lại này.Array prototype find method. This returns a value on a given criterion, otherwise, it returns ‘undefined’. It takes two parameters, one required callback function and an optional object, which will be set as a value of this inside the callback function.

Hàm gọi lại sẽ được gọi cho từng phần tử của mảng cho đến khi điều kiện đã cho cho một phần tử cụ thể là không đúng.
Một đối tượng sẽ là giá trị của điều này trong hàm gọi lại là một tham số tùy chọn và nếu nó không được truyền, giá trị sẽ được đặt thành không xác định trong hàm gọi lại.this in the callback function is an optional parameter, and if it’s not passed, the value will be set to undefined in the callback function.

Tham số chức năng gọi lại của phương thức Tìm có ba tham số:

Phần tử: Phần tử hiện tại được xử lý trong mảng
Chỉ mục: Chỉ số của phần tử hiện tại đang được xử lý
Mảng: & nbsp; mảng mà phương thức tìm đang được gọi

Hãy để chúng tôi nói rằng chúng tôi có chức năng gọi lại như trong danh sách dưới đây. Nó sẽ in phần tử hiện tại, chỉ mục của phần tử và mảng:

function CallbackFunctionToFindTaskById(element, index, array) {

        console.log(element);// print element being processed 
        console.log(index); // print index of the element being processed 
        console.log(array); // print the array on which find method is called 

    }

Phương pháp tìm hoạt động như thế nào?

Phương thức tìm JavaScript sẽ thực thi chức năng gọi lại cho từng phần tử của mảng. Vì vậy, nếu có 5 phần tử trong mảng, hàm gọi lại sẽ được thực thi năm lần.
Phương thức tìm JavaScript sẽ phá vỡ việc thực thi chức năng gọi lại khi tìm thấy một tiêu chí thực sự cho một yếu tố cụ thể.
Nếu tiêu chí đã cho là đúng đối với một phần tử, phương thức tìm JavaScript sẽ trả về phần tử cụ thể đó và sẽ không thực thi chức năng gọi lại cho các phần tử còn lại.
Nếu các tiêu chí không đúng với bất kỳ yếu tố nào, phương thức tìm JavaScript sẽ trả về không xác định.
Phương thức tìm JavaScript không thực thi chức năng gọi lại cho các chỉ mục không được đặt hoặc đã bị xóa.
Phương thức tìm JavaScript luôn thực hiện hàm gọi lại với ba đối số: phần tử, chỉ mục, mảng.

& nbsp; Hãy cho chúng tôi xem một số ví dụ về việc sử dụng phương thức tìm!

& nbsp; tìm một đối tượng trên một tiêu chí cố địnhFind an object on a fixed criterion

Chúng tôi có một mảng các nhiệm vụ như trong danh sách dưới đây:

   var tasks = [
                 { 'Id': '1', 'Title': 'Go to Market 99', 'Status': 'done' },
                 { 'Id': '2', 'Title': 'Email to manager', 'Status': 'pending' },
                 { 'Id': '3', 'Title': 'Push code to GitHub', 'Status': 'done' },
                 { 'Id': '4', 'Title': 'Go for running', 'Status': 'done' },
                 { 'Id': '5', 'Title': 'Go to movie', 'Status': 'pending' },
    ];

Chúng tôi muốn tìm một đối tượng có ID là ‘4. Chúng ta có thể làm điều đó như thể hiện trong danh sách dưới đây:

data['items1']['id'].name

0

Trong danh sách trên, chúng tôi đang chuyển chức năng gọi lại CallbackFoctionTofindTaskByid trong phương thức tìm mảng nhiệm vụ. & Nbsp; Luôn luôn, tham số đầu tiên của hàm gọi lại biểu thị tham số phần tử. Ở đây, tác vụ được đại diện cho phần tử bên trong chức năng gọi lại. Vì vậy, nhiệm vụ đại diện cho yếu tố hiện đang được xử lý.CallbackFunctionToFindTaskById in the find method of tasks array. Always, the first parameter of the callback function represents element parameter. Here the task is representing element inside the callback function. So, the task represents the element currently being processed.

Trong chức năng gọi lại, chúng tôi đang kiểm tra ID của tác vụ hiện tại và nếu nó bằng 4, hãy trả lại nhiệm vụ. & nbsp; Trong kịch bản này, các tiêu chí được cố định bên trong hàm gọi lại.

& nbsp; Tìm một đối tượng trên các tiêu chí được truyền trong hàm gọi lạiFind an object on criteria passed in the callback function

Trong ví dụ trước, chúng tôi đã có một tiêu chí cố định trả về một đối tượng với ID của ‘4. Tuy nhiên, có thể có một yêu cầu trong đó chúng ta có thể muốn vượt qua các tiêu chí trong khi gọi chức năng gọi lại. Chúng ta có thể chuyển một đối tượng là giá trị của điều này trong hàm gọi lại. Chúng ta hãy xem xét cùng một mảng nhiệm vụ một lần nữa, được hiển thị trong danh sách tiếp theo

data['items1']['id'].name

1

Tiếp theo, chúng ta hãy tạo chức năng gọi lại FindTaskByid như được hiển thị trong danh sách bên dưới:

data['items1']['id'].name

2

Như bạn nhận thấy, chúng tôi đang in giá trị của trò chơi này bên trong hàm gọi lại. Tiếp theo, chúng tôi sẽ vượt qua chức năng gọi lại FindByTask trong phương thức tìm mảng tác vụ như trong danh sách dưới đây:

data['items1']['id'].name

3

Trong trường hợp này, giá trị của hàm gọi lại bên trong này đã được đặt thành một đối tượng có hai giá trị: 4 và 67. Trong bảng điều khiển, bạn sẽ nhận được đầu ra như hình dưới đây:

Giá trị của điều này được in 5 lần vì có 5 yếu tố trong mảng nhiệm vụ. Để trả về một đối tượng với ID được đặt thành 4, chúng ta cần sửa đổi chức năng gọi lại như được hiển thị trong danh sách bên dưới

data['items1']['id'].name

4

Trong hàm gọi lại, chúng tôi đang chuyển giá trị của đối tượng này với thuộc tính đầu tiên được đặt thành 4. Do đó kiểm tra xem nhiệm vụ. ID bằng với [0] hoặc không sẽ trả về một đối tượng có ID 4.

Sự kết luận

Trong bài đăng này, chúng tôi đã tìm hiểu về phương thức tìm mảng JavaScript và các tùy chọn khác nhau với chức năng gọi lại. Hiểu rõ hơn về phương pháp tìm kiếm là điều cần thiết để trở thành một nhà phát triển JavaScript năng suất hơn và tôi hy vọng bạn thích đọc sách!

programming javascript