我的关闭出错了

时间:2016-11-04 05:41:06

标签: javascript jquery closures

我不仅得到了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();

1 个答案:

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