我不仅得到了InnerNewsAPI()未定义,但闭包在此代码中不起作用。我以为我从阅读You-dont-know-JS中正确地理解了闭包但我想我仍然很困惑。这段代码有什么问题,为什么我的封闭尝试在这里不起作用? (另外,我不认为我的API链接不起作用,但是这与我从关闭中获得“未定义”没有任何关系吗?
function NewsAPI() {
var authorOfArticle = [],
descriptionOfArticle = [],
publishedAtDate = [],
titleOfArticle = [],
urlOfArticle = [],
urlToImageOfArticle = [];
var newsConstructor = new XMLHttpRequest(),
url = 'https://newsapi.org/v1/articles?source=google-news&sortBy=top&apiKey=c99bdac4799a421cbe9fd3589b60397d';
newsConstructor.onreadystatechange = function () {
if (newsConstructor.readyState === 4 && newsConstructor.status === 200) {
var response = newsConstructor.responseText,
parsedNews = JSON.parse(response);
for (var i = 0; i < parsedNews["articles"].length; i++) {
authorOfArticle.push(parsedNews["articles"][i].author); // [0] = author
descriptionOfArticle.push(parsedNews["articles"][i].description); // [1] = description of article
publishedAtDate.push(parsedNews["articles"][i].publishedAt); // [2] = date published
titleOfArticle.push(parsedNews["articles"][i].title); // [3] = title
urlOfArticle.push(parsedNews["articles"][i].url); // [4] link to source
urlToImageOfArticle.push(parsedNews["articles"][i].urlToImage); // [5] = image url
}
console.log(titleOfArticle);
function InnerNewsAPI() {
$("document").ready(function () {
$("#a1title").text(titleOfArticle[0]).addClass("article articletitles");
$("#a1author").text("Author: " + authorOfArticle[0]).addClass("articleauthors");
$("#a1source").attr("href", urlOfArticle[0]).text(urlOfArticle[0]).addClass("articles articlesources");
$("#a1image").attr("src", urlToImageOfArticle[0]).addClass("article articleimages");
$("#a1description").text(descriptionOfArticle[0]).addClass("articledescriptions");
}); // put code above this line
newsConstructor.open("GET", url, true);
newsConstructor.send(null);
}
};
}
return InnerNewsAPI();
}
NewsAPI();
答案 0 :(得分:1)
没有闭包,因为你的函数定义和它的调用放在不同的范围内。 您的代码中的逻辑也看起来错误。在newsConstructor.onreadystatechange处理程序触发之前调用返回InnerNewsAPI()。也许这样的事情是你所期望的:
function NewsAPI() {
var authorOfArticle = [], descriptionOfArticle = [], publishedAtDate = [], titleOfArticle = [], urlOfArticle = [], urlToImageOfArticle = [];
var newsConstructor = new XMLHttpRequest(),
url = 'https://newsapi.org/v1/articles?source=google-news&sortBy=top&apiKey=c99bdac4799a421cbe9fd3589b60397d';
var InnerNewsAPI;
newsConstructor.onreadystatechange = function () {
if (newsConstructor.readyState === 4 && newsConstructor.status === 200) {
var response = newsConstructor.responseText,
parsedNews = JSON.parse(response);
for (var i=0; i < parsedNews["articles"].length; i++) {
authorOfArticle.push(parsedNews["articles"][i].author); // [0] = author
descriptionOfArticle.push(parsedNews["articles"][i].description); // [1] = description of article
publishedAtDate.push(parsedNews["articles"][i].publishedAt); // [2] = date published
titleOfArticle.push(parsedNews["articles"][i].title); // [3] = title
urlOfArticle.push(parsedNews["articles"][i].url); // [4] link to source
urlToImageOfArticle.push(parsedNews["articles"][i].urlToImage); // [5] = image url
}
console.log(titleOfArticle);
InnerNewsAPI = function () {
$("document").ready(function() {
$("#a1title").text(titleOfArticle[0]).addClass("article articletitles");
$("#a1author").text("Author: " + authorOfArticle[0]).addClass("articleauthors");
$("#a1source").attr("href",urlOfArticle[0]).text(urlOfArticle[0]).addClass("articles articlesources");
$("#a1image").attr("src", urlToImageOfArticle[0]).addClass("article articleimages");
$("#a1description").text(descriptionOfArticle[0]).addClass("articledescriptions");
}); // put code above this line
newsConstructor.open("GET", url, true);
newsConstructor.send(null);
}};
}
return InnerNewsAPI;
}
NewsAPI();