Chrome 확장 프로그램을 개발하는 동안 chrome.tabs.query를 통해 얻은 결과가 다음과 같은 문제가 발생했습니다. 중단점 없이 코드가 실행된 경우에는 사용할 수 없습니다. 이 문제를 분석하기 위해 chrome.tabs.query 함수의 비동기 특성을 자세히 살펴보겠습니다.
chrome.tabs.query와 같은 비동기 함수는 다음 위치에서 코드를 실행합니다. 주요 실행 흐름과 관계없이 이후 시점. 코드 조각에서:
// Initialize an empty array var fourmTabs = new Array(); // Initiate asynchronous `chrome.tabs.query` call chrome.tabs.query({}, function (tabs) { // Iterate over returned tabs for (var i = 0; i < tabs.length; i++) { // Store tabs in array fourmTabs[i] = tabs[i]; } });
이 코드가 실행되면 chrome.tabs.query 호출이 실행되고 요청이 시작되지만 JavaScript 실행은 다음 줄까지 계속됩니다. chrome.tabs.query의 두 번째 인수로 제공된 콜백 함수는 즉시 호출되지 않습니다.
// Print tab URLs (before callback has been called) for (var i = 0; i < fourmTabs.length; i++) { if (fourmTabs[i] != null) window.console.log(fourmTabs[i].url); else { window.console.log("??" + i); } }
위 코드에서 루프가 실행될 때 콜백 함수가 다음을 수행하므로 fourmTabs 배열은 여전히 비어 있습니다. 아직 호출되지 않았습니다. 따라서 콘솔은 "??"를 출력합니다.
중단점을 사용하면 코드 실행이 일시 중지되어 콜백 함수가 fourmTabs 배열을 실행하고 업데이트할 수 있습니다. 이렇게 하면 두 번째 루프가 업데이트된 탭 정보에 액세스하고 URL을 올바르게 인쇄할 수 있습니다.
이 문제를 해결하고 코드가 실행될 때 탭을 사용할 수 있는지 확인하려면 중단점을 사용하려면 chrome.tabs.query의 콜백 함수 내에서 두 번째 루프를 이동하세요. 이렇게 하면 콜백이 호출된 후 루프가 실행됩니다.
// Initialize an empty array var fourmTabs = new Array(); // Initiate asynchronous `chrome.tabs.query` call chrome.tabs.query({}, function (tabs) { // Update `fourmTabs` array for (var i = 0; i < tabs.length; i++) { fourmTabs[i] = tabs[i]; } // Print tab URLs (after callback has been called) for (var i = 0; i < fourmTabs.length; i++) { if (fourmTabs[i] != null) window.console.log(fourmTabs[i].url); else { window.console.log("??" + i); } } });
이 수정을 사용하면 두 번째 루프는 fourmTabs 배열이 호출된 후에만 실행되므로 중단점 없이 코드가 올바르게 실행됩니다. 콜백 기능으로 업데이트되었습니다.
위 내용은 내 Chrome 확장 프로그램의 탭 정보가 중단점 없이 비어 있는 것처럼 나타나는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!