zoukankan      html  css  js  c++  java
  • [Javascript] Ex: concatAll, map and filter

    concatAll:

    Array.prototype.concatAll = function() {
        var results = [];
        this.forEach(function(subArray) {
            // ------------ INSERT CODE HERE! ----------------------------
            // Add all the items in each subArray to the results array.
            // ------------ INSERT CODE HERE! ----------------------------
        subArray.forEach(function(sub){
             results.push(sub)            
                         })
        });
    
        return results;
    };

    Exercise 12: Retrieve id, title, and a 150x200 box art url for every video

    You've managed to flatten a tree that's two levels deep, let's try for three! Let's say that instead of a single boxart url on each video, we had a collection of boxart objects, each with a different size and url. Create a query that selects {id, title, boxart} for every video in the movieLists. This time though, the boxart property in the result will be the url of the boxart object with dimensions of 150x200px. Let's see if you can solve this problem with map(), concatAll(), and filter().

    There's just more one thing: you can't use indexers. In other words, this is illegal:

    var itemInArray = movieLists[0];
    			

    Furthermore, you're not allowed to use indexers in any of the remaining exercises unless you're implementing one of the five functions. There is a very good reason for this restriction, and that reason will eventually be explained. For now, you'll simply have to accept it on faith that this restriction serves a purpose. :-)

    function() {
        var movieLists = [
                {
                    name: "Instant Queue",
                    videos : [
                        {
                            "id": 70111470,
                            "title": "Die Hard",
                            "boxarts": [
                                {  150, height:200, url:"http://cdn-0.nflximg.com/images/2891/DieHard150.jpg" },
                                {  200, height:200, url:"http://cdn-0.nflximg.com/images/2891/DieHard200.jpg" }
                            ],
                            "url": "http://api.netflix.com/catalog/titles/movies/70111470",
                            "rating": 4.0,
                            "bookmark": []
                        },
                        {
                            "id": 654356453,
                            "title": "Bad Boys",
                            "boxarts": [
                                {  200, height:200, url:"http://cdn-0.nflximg.com/images/2891/BadBoys200.jpg" },
                                {  150, height:200, url:"http://cdn-0.nflximg.com/images/2891/BadBoys150.jpg" }
    
                            ],
                            "url": "http://api.netflix.com/catalog/titles/movies/70111470",
                            "rating": 5.0,
                            "bookmark": [{ id:432534, time:65876586 }]
                        }
                    ]
                },
                {
                    name: "New Releases",
                    videos: [
                        {
                            "id": 65432445,
                            "title": "The Chamber",
                            "boxarts": [
                                {  150, height:200, url:"http://cdn-0.nflximg.com/images/2891/TheChamber150.jpg" },
                                {  200, height:200, url:"http://cdn-0.nflximg.com/images/2891/TheChamber200.jpg" }
                            ],
                            "url": "http://api.netflix.com/catalog/titles/movies/70111470",
                            "rating": 4.0,
                            "bookmark": []
                        },
                        {
                            "id": 675465,
                            "title": "Fracture",
                            "boxarts": [
                                {  200, height:200, url:"http://cdn-0.nflximg.com/images/2891/Fracture200.jpg" },
                                {  150, height:200, url:"http://cdn-0.nflximg.com/images/2891/Fracture150.jpg" },
                                {  300, height:200, url:"http://cdn-0.nflximg.com/images/2891/Fracture300.jpg" }
                            ],
                            "url": "http://api.netflix.com/catalog/titles/movies/70111470",
                            "rating": 5.0,
                            "bookmark": [{ id:432534, time:65876586 }]
                        }
                    ]
                }
            ];
    
    
        // Use one or more map, concatAll, and filter calls to create an array with the following items
        // [
        //     {"id": 675465,"title": "Fracture","boxart":"http://cdn-0.nflximg.com/images/2891/Fracture150.jpg" },
        //     {"id": 65432445,"title": "The Chamber","boxart":"http://cdn-0.nflximg.com/images/2891/TheChamber150.jpg" },
        //     {"id": 654356453,"title": "Bad Boys","boxart":"http://cdn-0.nflximg.com/images/2891/BadBoys150.jpg" },
        //     {"id": 70111470,"title": "Die Hard","boxart":"http://cdn-0.nflximg.com/images/2891/DieHard150.jpg" }
        // ];
      
      return movieLists
        .map(function(movieList){
          return movieList.videos.map(function(video){
            return video.boxarts.filter(function(boxart){
             return boxart.width === 150;
            })
            .map( function(boxart){
              return {id: video.id, title: video.title, boxart: boxart.url}
            })
          }).concatAll()
        }).concatAll()
    }
            

    You need to make sure you got everything you need to display.  So there are three level deep. Any apply n-1 concatAll.

  • 相关阅读:
    闲来无事,编写一个数据迁移小工具
    Moq基础
    探索逻辑事务 TransactionScope
    IntelliJ IDEA安装及jsp开发环境搭建
    数据结构整理(二) 树
    数据结构整理(一) 线性结构
    梳理delegate相关概念
    02_Android应用界面编程_01_视图(View)组件
    01_Android应用开发环境_05_签名android应用程序
    01_Android应用开发环境_04_Android常用开发工具的用法
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5618801.html
Copyright © 2011-2022 走看看