đối tượng JavaScript trở về từ chức năng có sẵn trong Chrome Dev Tools, nhưng không phải từ kịch bản

Question

EDIT

tôi là một chút nhanh chóng đó, các vấn đề phát sinh trong chức năng và không phải là nơi đầu tiên tôi nói. Đây là hàm:

function returnAnObject(url) { 
    var apiurl = 'http://url.com'; 

    var info = {}; 
    $.getJSON(apiurl, function(data) { 
    $.extend(info, { 
     a : data.x, 
     b : data.y, 
     c : data.z 
    }); 
    }); 

    console.log(info); // Shows object as usual 
    console.log(info.a); // Shows undefined 
    return info; 
} 

Điều đó có làm cho nó rõ ràng hơn không?

END EDIT

Ok như vậy, tôi có một vấn đề nhỏ.

Tôi có một hàm trả về một đối tượng khá đơn giản, mà trông giống như sau:

{ 
    a: 'x', 
    b: 'y', 
    c: 'z' 
} 

tôi lưu nó vào một biến như thế này:

var something = functionThatReturnsObject(someargument); 
console.log(something); // In chrome dev tools, I see the object and its values 
console.log(something.a); // This, however, logs undefined 
console.log(something['a']); // This also logs undefined 

Tại sao điều này? Tôi nghĩ rằng tôi sẽ điên đây, tôi phải bỏ qua một cái gì đó ...

Phần thực sự kỳ lạ xảy ra nếu thay vì

var something = functionThatReturnsObject(someargument); 

tôi viết

window.something = functionThatReturnsObject(someargument); 
console.log(something); // Still works, showing the object and properties 
console.log(something.a); // Still doesn't work 
console.log(someting['a']); // Still doesn't work 

Nếu bây giờ tôi truy cập đối tượng trực tiếp từ các công cụ dev, nhập

something; // returns object, I can see everything in it etc. 
something.a // Now, for some mysterious (to me) reason, this works, returning the value of a 

Vì vậy, có ai hiểu điều gì đang xảy ra với cô ấy không e?

Answer 1

Như tôi đã nghi ngờ. Bạn đang chỉ định thông tin trong trình xử lý thành công cho cuộc gọi hàm không đồng bộ. Trình xử lý thành công không thực thi cho đến SAU KHI cuộc gọi ajax hoàn thành, nhưng hàm của bạn trả về ngay sau khi cuộc gọi ajax bắt đầu (và lâu trước khi nó kết thúc và thành công). Bạn có thể không tin điều này, nhưng đây là lần thứ tư tôi đã trả lời chính xác cùng một loại vấn đề này ngày hôm nay. Đó là một sai lầm rất phổ biến. Bởi vì trình xử lý thành công nội tuyến, có vẻ như tất cả đều xảy ra bên trong hàm chính, nhưng thực tế nó xảy ra lâu sau khi hàm đó kết thúc.

Bạn không thể sử dụng kết quả trả về từ cuộc gọi ajax cho đến sau khi xử lý thành công được gọi. Nếu bạn muốn chuyển kết quả đó vào mã tiếp theo, bạn sẽ phải gọi mã tiếp theo đó từ trình xử lý thành công, không tiếp tục sau khi gọi hàm returnAnObject.

Nó hoạt động trong các công cụ dành cho nhà phát triển bởi vì cuộc gọi ajax hoàn thành vào lúc bạn nhập bất kỳ thứ gì vào công cụ dev hoặc xem ở đó. Nhưng, info.a không có sẵn ở cuối hàm returnAnObject. Nó chỉ có sẵn khi trình xử lý thành công cho hàm ajax được gọi.