-1

在一个教程中,我看到他们使用 JSON 从 twitter 获取信息,然后粘贴到模板(Handlebars)中。我对 JSON 和从服务器获取信息的这个概念真的很陌生,但最让我困惑的是 $.JSON 和 $map 中的匿名函数是它们使用回调函数并传递一些参数。我不明白它们来自哪里以及为什么要引用它们。如果有人能给我一个线索,那就太好了。谢谢

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Twiiter API</title>
</head>
<body>
    <ul class="tweets">
        <script id="tweets-template" type="text/x-handlebars-template" >
        {{#each this}}
            <li>
                <img src = "{{thumb}}" alt= "{{author}}">
                <p><a href="{{url}}">{{tweet}}</a></p>
            </li>
        {{/each}}       
        </script> 
    </ul> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js"></script>
    <script>
    (function(){
            var Twitter = {
                init: function(config){
                    this.url = 'http://search.twitter.com/search.json?q=' + config.query + '&callback=?';

                    this.template = config.template;
                    this.container = config.container;
                    this.fetch();
                },

                attachTemplate : function(){
                        var template = Handlebars.compile(this.template);
                        this.container.append(template (this.tweets));
                },

                fetch: function(){
                    var self = this; // This REFERS TO TWITTER  OBJECT
                    $.getJSON(this.url, function (data){
                        //$.map WILL FILTER THROUGH AN ARRAY AND FOR EACH ONE OF THOES IT WILL EXECUTE A FUNCTION
                        self.tweets =  $.map(data.results, function(tweet){
                                return {
                                    author : tweet.from_user,
                                    tweet : tweet.text,
                                    thumb: tweet.profile_image_url,
                                    url: 'http://twitter.com/' + tweet.form_user + '/status/' + tweet.id_str
                                };
                        });

                    self.attachTemplate();
                    });
                }
            };  
            Twitter.init({
                template:$('#tweets-template').html(),
                container:$('ul.tweets'),
                query: 'tutspremium'
            });
    })();
    </script>
</body>
</html>
4