Question

这是一门课程的练习。给定一个对象数组，我必须使用map方法循环所有元素，并返回一个称为“ rating”的新变量，这是一个仅包含每个对象的Title和Rating属性的新数组。给定的对象数组就是这个：

var watchList = [
             {  
               "Title": "Inception",
               "Year": "2010",
               "Rated": "PG-13",
               "Released": "16 Jul 2010",
               "Runtime": "148 min",
               "Genre": "Action, Adventure, Crime",
               "Director": "Christopher Nolan",
               "Writer": "Christopher Nolan",
               "Actors": "Leonardo DiCaprio, Joseph Gordon-Levitt, Ellen Page, Tom Hardy",
               "Plot": "A thief, who steals corporate secrets through use of dream-sharing technology, is given the inverse task of planting an idea into the mind of a CEO.",
               "Language": "English, Japanese, French",
               "Country": "USA, UK",
               "Awards": "Won 4 Oscars. Another 143 wins & 198 nominations.",
               "Poster": "http://ia.media-imdb.com/images/M/MV5BMjAxMzY3NjcxNF5BMl5BanBnXkFtZTcwNTI5OTM0Mw@@._V1_SX300.jpg",
               "Metascore": "74",
               "imdbRating": "8.8",
               "imdbVotes": "1,446,708",
               "imdbID": "tt1375666",
               "Type": "movie",
               "Response": "True"
            },
            {  
               "Title": "Interstellar",
               "Year": "2014",
               "Rated": "PG-13",
               "Released": "07 Nov 2014",
               "Runtime": "169 min",
               "Genre": "Adventure, Drama, Sci-Fi",
               "Director": "Christopher Nolan",
               "Writer": "Jonathan Nolan, Christopher Nolan",
               "Actors": "Ellen Burstyn, Matthew McConaughey, Mackenzie Foy, John Lithgow",
               "Plot": "A team of explorers travel through a wormhole in space in an attempt to ensure humanity's survival.",
               "Language": "English",
               "Country": "USA, UK",
               "Awards": "Won 1 Oscar. Another 39 wins & 132 nominations.",
               "Poster": "http://ia.media-imdb.com/images/M/MV5BMjIxNTU4MzY4MF5BMl5BanBnXkFtZTgwMzM4ODI3MjE@._V1_SX300.jpg",
               "Metascore": "74",
               "imdbRating": "8.6",
               "imdbVotes": "910,366",
               "imdbID": "tt0816692",
               "Type": "movie",
               "Response": "True"
            },
            {
               "Title": "The Dark Knight",
               "Year": "2008",
               "Rated": "PG-13",
               "Released": "18 Jul 2008",
               "Runtime": "152 min",
               "Genre": "Action, Adventure, Crime",
               "Director": "Christopher Nolan",
               "Writer": "Jonathan Nolan (screenplay), Christopher Nolan (screenplay), Christopher Nolan (story), David S. Goyer (story), Bob Kane (characters)",
               "Actors": "Christian Bale, Heath Ledger, Aaron Eckhart, Michael Caine",
               "Plot": "When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, the caped crusader must come to terms with one of the greatest psychological tests of his ability to fight injustice.",
               "Language": "English, Mandarin",
               "Country": "USA, UK",
               "Awards": "Won 2 Oscars. Another 146 wins & 142 nominations.",
               "Poster": "http://ia.media-imdb.com/images/M/MV5BMTMxNTMwODM0NF5BMl5BanBnXkFtZTcwODAyMTk2Mw@@._V1_SX300.jpg",
               "Metascore": "82",
               "imdbRating": "9.0",
               "imdbVotes": "1,652,832",
               "imdbID": "tt0468569",
               "Type": "movie",
               "Response": "True"
            },
            {  
               "Title": "Batman Begins",
               "Year": "2005",
               "Rated": "PG-13",
               "Released": "15 Jun 2005",
               "Runtime": "140 min",
               "Genre": "Action, Adventure",
               "Director": "Christopher Nolan",
               "Writer": "Bob Kane (characters), David S. Goyer (story), Christopher Nolan (screenplay), David S. Goyer (screenplay)",
               "Actors": "Christian Bale, Michael Caine, Liam Neeson, Katie Holmes",
               "Plot": "After training with his mentor, Batman begins his fight to free crime-ridden Gotham City from the corruption that Scarecrow and the League of Shadows have cast upon it.",
               "Language": "English, Urdu, Mandarin",
               "Country": "USA, UK",
               "Awards": "Nominated for 1 Oscar. Another 15 wins & 66 nominations.",
               "Poster": "http://ia.media-imdb.com/images/M/MV5BNTM3OTc0MzM2OV5BMl5BanBnXkFtZTYwNzUwMTI3._V1_SX300.jpg",
               "Metascore": "70",
               "imdbRating": "8.3",
               "imdbVotes": "972,584",
               "imdbID": "tt0372784",
               "Type": "movie",
               "Response": "True"
            },
            {
               "Title": "Avatar",
               "Year": "2009",
               "Rated": "PG-13",
               "Released": "18 Dec 2009",
               "Runtime": "162 min",
               "Genre": "Action, Adventure, Fantasy",
               "Director": "James Cameron",
               "Writer": "James Cameron",
               "Actors": "Sam Worthington, Zoe Saldana, Sigourney Weaver, Stephen Lang",
               "Plot": "A paraplegic marine dispatched to the moon Pandora on a unique mission becomes torn between following his orders and protecting the world he feels is his home.",
               "Language": "English, Spanish",
               "Country": "USA, UK",
               "Awards": "Won 3 Oscars. Another 80 wins & 121 nominations.",
               "Poster": "http://ia.media-imdb.com/images/M/MV5BMTYwOTEwNjAzMl5BMl5BanBnXkFtZTcwODc5MTUwMw@@._V1_SX300.jpg",
               "Metascore": "83",
               "imdbRating": "7.9",
               "imdbVotes": "876,575",
               "imdbID": "tt0499549",
               "Type": "movie",
               "Response": "True"
            }];

最终结果应如下：

[{"title":"Inception","rating":"8.8"},{"title":"Interstellar","rating":"8.6"},{"title":"The Dark Knight","rating":"9.0"},{"title":"Batman Begins","rating":"8.3"},{"title":"Avatar","rating":"7.9"}]

老实说，由于我无法真正提出解决方案，因此寻找并找到了这个解决方案：

rating = watchList.map( (item) => ({"title":item["Title"], "rating":item["imdbRating"]}) );

但是这只是我仅部分理解的箭头功能，因此我试图使用ECMA5规则解决它，而我尝试了以下方法：

var rating = watchList.map(function (item){
let obj ={
   "title":item["Title"], 
    "rating":item["imdbRating"]
    }
    return obj;

}）;

我的意思是，对于地图元素循环的每个元素，它都会在新数组中返回一个对象，但在控制台上显示的结果是：

[object Object],[object Object],[object Object],[object Object],[object Object]

那么，如何在不使用箭头函数的情况下编写函数并获得确切的结果？

提前谢谢

Answer 1

问题可能出在您使用console.log的方式上（对象打印为[object Object]的字符串连接）。

两个map函数都产生相同的响应。此处演示

Answer 2

它完美地工作-看看我如何将箭头功能修改为与ES5兼容的功能：

var watchList = [{
    "Title": "Inception",
    "Year": "2010",
    "Rated": "PG-13",
    "Released": "16 Jul 2010",
    "Runtime": "148 min",
    "Genre": "Action, Adventure, Crime",
    "Director": "Christopher Nolan",
    "Writer": "Christopher Nolan",
    "Actors": "Leonardo DiCaprio, Joseph Gordon-Levitt, Ellen Page, Tom Hardy",
    "Plot": "A thief, who steals corporate secrets through use of dream-sharing technology, is given the inverse task of planting an idea into the mind of a CEO.",
    "Language": "English, Japanese, French",
    "Country": "USA, UK",
    "Awards": "Won 4 Oscars. Another 143 wins & 198 nominations.",
    "Poster": "http://ia.media-imdb.com/images/M/MV5BMjAxMzY3NjcxNF5BMl5BanBnXkFtZTcwNTI5OTM0Mw@@._V1_SX300.jpg",
    "Metascore": "74",
    "imdbRating": "8.8",
    "imdbVotes": "1,446,708",
    "imdbID": "tt1375666",
    "Type": "movie",
    "Response": "True"
  },
  {
    "Title": "Interstellar",
    "Year": "2014",
    "Rated": "PG-13",
    "Released": "07 Nov 2014",
    "Runtime": "169 min",
    "Genre": "Adventure, Drama, Sci-Fi",
    "Director": "Christopher Nolan",
    "Writer": "Jonathan Nolan, Christopher Nolan",
    "Actors": "Ellen Burstyn, Matthew McConaughey, Mackenzie Foy, John Lithgow",
    "Plot": "A team of explorers travel through a wormhole in space in an attempt to ensure humanity's survival.",
    "Language": "English",
    "Country": "USA, UK",
    "Awards": "Won 1 Oscar. Another 39 wins & 132 nominations.",
    "Poster": "http://ia.media-imdb.com/images/M/MV5BMjIxNTU4MzY4MF5BMl5BanBnXkFtZTgwMzM4ODI3MjE@._V1_SX300.jpg",
    "Metascore": "74",
    "imdbRating": "8.6",
    "imdbVotes": "910,366",
    "imdbID": "tt0816692",
    "Type": "movie",
    "Response": "True"
  },
  {
    "Title": "The Dark Knight",
    "Year": "2008",
    "Rated": "PG-13",
    "Released": "18 Jul 2008",
    "Runtime": "152 min",
    "Genre": "Action, Adventure, Crime",
    "Director": "Christopher Nolan",
    "Writer": "Jonathan Nolan (screenplay), Christopher Nolan (screenplay), Christopher Nolan (story), David S. Goyer (story), Bob Kane (characters)",
    "Actors": "Christian Bale, Heath Ledger, Aaron Eckhart, Michael Caine",
    "Plot": "When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, the caped crusader must come to terms with one of the greatest psychological tests of his ability to fight injustice.",
    "Language": "English, Mandarin",
    "Country": "USA, UK",
    "Awards": "Won 2 Oscars. Another 146 wins & 142 nominations.",
    "Poster": "http://ia.media-imdb.com/images/M/MV5BMTMxNTMwODM0NF5BMl5BanBnXkFtZTcwODAyMTk2Mw@@._V1_SX300.jpg",
    "Metascore": "82",
    "imdbRating": "9.0",
    "imdbVotes": "1,652,832",
    "imdbID": "tt0468569",
    "Type": "movie",
    "Response": "True"
  },
  {
    "Title": "Batman Begins",
    "Year": "2005",
    "Rated": "PG-13",
    "Released": "15 Jun 2005",
    "Runtime": "140 min",
    "Genre": "Action, Adventure",
    "Director": "Christopher Nolan",
    "Writer": "Bob Kane (characters), David S. Goyer (story), Christopher Nolan (screenplay), David S. Goyer (screenplay)",
    "Actors": "Christian Bale, Michael Caine, Liam Neeson, Katie Holmes",
    "Plot": "After training with his mentor, Batman begins his fight to free crime-ridden Gotham City from the corruption that Scarecrow and the League of Shadows have cast upon it.",
    "Language": "English, Urdu, Mandarin",
    "Country": "USA, UK",
    "Awards": "Nominated for 1 Oscar. Another 15 wins & 66 nominations.",
    "Poster": "http://ia.media-imdb.com/images/M/MV5BNTM3OTc0MzM2OV5BMl5BanBnXkFtZTYwNzUwMTI3._V1_SX300.jpg",
    "Metascore": "70",
    "imdbRating": "8.3",
    "imdbVotes": "972,584",
    "imdbID": "tt0372784",
    "Type": "movie",
    "Response": "True"
  },
  {
    "Title": "Avatar",
    "Year": "2009",
    "Rated": "PG-13",
    "Released": "18 Dec 2009",
    "Runtime": "162 min",
    "Genre": "Action, Adventure, Fantasy",
    "Director": "James Cameron",
    "Writer": "James Cameron",
    "Actors": "Sam Worthington, Zoe Saldana, Sigourney Weaver, Stephen Lang",
    "Plot": "A paraplegic marine dispatched to the moon Pandora on a unique mission becomes torn between following his orders and protecting the world he feels is his home.",
    "Language": "English, Spanish",
    "Country": "USA, UK",
    "Awards": "Won 3 Oscars. Another 80 wins & 121 nominations.",
    "Poster": "http://ia.media-imdb.com/images/M/MV5BMTYwOTEwNjAzMl5BMl5BanBnXkFtZTcwODc5MTUwMw@@._V1_SX300.jpg",
    "Metascore": "83",
    "imdbRating": "7.9",
    "imdbVotes": "876,575",
    "imdbID": "tt0499549",
    "Type": "movie",
    "Response": "True"
  }
];

var ratings = watchList.map(function(item) {
  return {"Title": item["Title"], "Rating": item["imdbRating"]}
});

console.log(ratings);

Answer 3

在您的情况下，箭头符号或function关键字等效于创建函数。这是因为您没有使用this或任何外部绑定。而且，您的语法很好。

请注意，如果要查看对象的实际内容，“标准”方法是从对象中获取JSON 。

您应该可以使用console.log(JSON.stringify(yourObject))，它应该可以为您带来期望。

Answer 4

控制台日志为您的监视列表返回[object，object]，因为这是一个数组内的对象，这是正确的，我通过控制台记录监视列表的控制台在这里尝试了您的代码，并返回了所需的数组对象结果：https://es6console.com/jr72hz5j/

如果您很难理解箭头功能，我会为您提供帮助，因为这是比es5语法更好的实现方式：

const rating =  // the Storing of your Variable this should be constant if your don't want the data to be changed and let if you want to change it later
watchList.map( (item) => // this is equal to function(item) {} the item here is each element of your arra.
({"title":item["Title"], // this stores the object with a key of title you can also use item.Title instead
"rating":item["imdbRating"]})  // This stores the imdb rating to your new rating object you can also use item.imdbRating instead for shorter code
);

es6可以实现较短的行，并且可以创建较短的实现。如果您有任何疑问，请在评论中回复

Answer 5

我对您的原始代码进行了编译，以同时包含ES5和ES6函数（两者都可以正常工作）以及console.log('ES5', ratingES5);和console.log('ES6', ratingES6);。

两个console.logs均返回所需的输出。您如何使用console.log？这可能是问题所在。

var watchList = [
  {  
   "Title": "Inception",
   "Year": "2010",
   "Rated": "PG-13",
   "Released": "16 Jul 2010",
   "Runtime": "148 min",
   "Genre": "Action, Adventure, Crime",
   "Director": "Christopher Nolan",
   "Writer": "Christopher Nolan",
   "Actors": "Leonardo DiCaprio, Joseph Gordon-Levitt, Ellen Page, Tom Hardy",
   "Plot": "A thief, who steals corporate secrets through use of dream-sharing technology, is given the inverse task of planting an idea into the mind of a CEO.",
   "Language": "English, Japanese, French",
   "Country": "USA, UK",
  "Awards": "Won 4 Oscars. Another 143 wins & 198 nominations.",
  "Poster": "http://ia.media-imdb.com/images/M/MV5BMjAxMzY3NjcxNF5BMl5BanBnXkFtZTcwNTI5OTM0Mw@@._V1_SX300.jpg",
  "Metascore": "74",
  "imdbRating": "8.8",
  "imdbVotes": "1,446,708",
  "imdbID": "tt1375666",
  "Type": "movie",
  "Response": "True"
  },
  {  
  "Title": "Interstellar",
  "Year": "2014",
  "Rated": "PG-13",
  "Released": "07 Nov 2014",
  "Runtime": "169 min",
  "Genre": "Adventure, Drama, Sci-Fi",
  "Director": "Christopher Nolan",
  "Writer": "Jonathan Nolan, Christopher Nolan",
  "Actors": "Ellen Burstyn, Matthew McConaughey, Mackenzie Foy, John Lithgow",
  "Plot": "A team of explorers travel through a wormhole in space in an attempt to ensure humanity's survival.",
  "Language": "English",
  "Country": "USA, UK",
  "Awards": "Won 1 Oscar. Another 39 wins & 132 nominations.",
  "Poster": "http://ia.media-imdb.com/images/M/MV5BMjIxNTU4MzY4MF5BMl5BanBnXkFtZTgwMzM4ODI3MjE@._V1_SX300.jpg",
  "Metascore": "74",
  "imdbRating": "8.6",
  "imdbVotes": "910,366",
  "imdbID": "tt0816692",
  "Type": "movie",
  "Response": "True"
  },
  {
  "Title": "The Dark Knight",
  "Year": "2008",
  "Rated": "PG-13",
  "Released": "18 Jul 2008",
  "Runtime": "152 min",
  "Genre": "Action, Adventure, Crime",
  "Director": "Christopher Nolan",
  "Writer": "Jonathan Nolan (screenplay), Christopher Nolan (screenplay), Christopher Nolan (story), David S. Goyer (story), Bob Kane (characters)",
  "Actors": "Christian Bale, Heath Ledger, Aaron Eckhart, Michael Caine",
  "Plot": "When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, the caped crusader must come to terms with one of the greatest psychological tests of his ability to fight injustice.",
  "Language": "English, Mandarin",
  "Country": "USA, UK",
  "Awards": "Won 2 Oscars. Another 146 wins & 142 nominations.",
  "Poster": "http://ia.media-imdb.com/images/M/MV5BMTMxNTMwODM0NF5BMl5BanBnXkFtZTcwODAyMTk2Mw@@._V1_SX300.jpg",
  "Metascore": "82",
  "imdbRating": "9.0",
  "imdbVotes": "1,652,832",
  "imdbID": "tt0468569",
  "Type": "movie",
  "Response": "True"
  },
  {  
  "Title": "Batman Begins",
  "Year": "2005",
  "Rated": "PG-13",
  "Released": "15 Jun 2005",
  "Runtime": "140 min",
  "Genre": "Action, Adventure",
  "Director": "Christopher Nolan",
  "Writer": "Bob Kane (characters), David S. Goyer (story), Christopher Nolan (screenplay), David S. Goyer (screenplay)",
  "Actors": "Christian Bale, Michael Caine, Liam Neeson, Katie Holmes",
  "Plot": "After training with his mentor, Batman begins his fight to free crime-ridden Gotham City from the corruption that Scarecrow and the League of Shadows have cast upon it.",
  "Language": "English, Urdu, Mandarin",
  "Country": "USA, UK",
  "Awards": "Nominated for 1 Oscar. Another 15 wins & 66 nominations.",
  "Poster": "http://ia.media-imdb.com/images/M/MV5BNTM3OTc0MzM2OV5BMl5BanBnXkFtZTYwNzUwMTI3._V1_SX300.jpg",
  "Metascore": "70",
  "imdbRating": "8.3",
  "imdbVotes": "972,584",
  "imdbID": "tt0372784",
  "Type": "movie",
  "Response": "True"
  },
  {
  "Title": "Avatar",
  "Year": "2009",
  "Rated": "PG-13",
  "Released": "18 Dec 2009",
  "Runtime": "162 min",
  "Genre": "Action, Adventure, Fantasy",
  "Director": "James Cameron",
  "Writer": "James Cameron",
  "Actors": "Sam Worthington, Zoe Saldana, Sigourney Weaver, Stephen Lang",
  "Plot": "A paraplegic marine dispatched to the moon Pandora on a unique mission becomes torn between following his orders and protecting the world he feels is his home.",
  "Language": "English, Spanish",
  "Country": "USA, UK",
  "Awards": "Won 3 Oscars. Another 80 wins & 121 nominations.",
  "Poster": "http://ia.media-imdb.com/images/M/MV5BMTYwOTEwNjAzMl5BMl5BanBnXkFtZTcwODc5MTUwMw@@._V1_SX300.jpg",
  "Metascore": "83",
  "imdbRating": "7.9",
  "imdbVotes": "876,575",
  "imdbID": "tt0499549",
  "Type": "movie",
  "Response": "True"
  }
];       

let ratingES6 = watchList.map( (item) => ({"title":item["Title"], "rating":item["imdbRating"]}) );

var ratingES5 = watchList.map(function(item) {
  let obj = { "title":item["Title"], "rating":item["imdbRating"] }
  return obj;
});

console.log('ES5', ratingES5);
// [{"title":"Inception","rating":"8.8"},{"title": "Interstellar","rating":"8.6"},{"title":"The Dark Knight","rating":"9.0"},{"title":"Batman Begins","rating":"8.3"},{"title":"Avatar","rating":"7.9"}]

console.log('ES6', ratingES6);
// logs same output above

如何在不使用箭头功能的情况下编写此功能？

5 个答案: