16.6: Array Functions: map() and fill() - Topics of JavaScript/ES6

  • Published on Feb 20, 2018
  • In this video, I discuss two array functions in JavaScript: map() and fill().
    🎥 Next Video: thexvid.com/video/-LFjnY1PEDA/video.html
    🔗 MDN's Array Documentation: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array
    🎥 Prototypes in JavaScript: thexvid.com/video/hS_WqkyUah8/video.html
    🚂 The Coding Train website: thecodingtrain.com/
    💖 Support this channel on Patreon: patreon.com/codingtrain
    🛒 To buy Coding Train merchandise: www.designbyhumans.com/shop/codingtrain/
    📚 Book recommendations: www.amazon.com/shop/thecodingtrain
    💻 github.com/CodingTrain/Rainbow-Code
    🎥 For an Introduction to Programming: thexvid.com/p/PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA
    🎥 For More Coding Challenges: thexvid.com/p/PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
    🔗 p5js.org/
    🔗 processing.org
    📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct

Comments • 86

  • Francesca Norelli
    Francesca Norelli 8 days ago

    Love your videos...especially when I'm feeling frustrated and need to revisit concepts...makes my learning enjoyable :-))))) thank you :-)))))))

  • Kay Ramen
    Kay Ramen Month ago

    10:33 LOL

  • vivek raj
    vivek raj Month ago

    I'm the 1k-th liker😁😁😁😁

  • HeyDan1983
    HeyDan1983 3 months ago

    Would be great to have a coworker with your personality, thanks for the great videos!

  • Charles B
    Charles B 3 months ago

    Thank you, i am trying to get to expertise level ES6. Informative and entertaining

  • Michael Naccarato
    Michael Naccarato 3 months ago

    I really appreciate taking the time to explain these complicated ES6 Functions. I have one question ... How would I modify the fill syntax to produce an integer vs these tiny numbers that was the result in the video.? I tried using math.floor and * 10 but was unable to get the syntax to work. Appreciate all that you do!!!

  • yara castro
    yara castro 4 months ago +1

    I really appreciate the work you put into creating these videos. You are my to go guy if when I can't understand a concept. THANK YOU!!

  • ramosweb dev
    ramosweb dev 5 months ago +1

    Thanks for that! Very well explained! I saw the entire video, but just for recaps:
    03:17 - map()
    08:32 - fill()

  • Yousuf Khalid
    Yousuf Khalid 5 months ago

    Hahahahha You are a great instructor finally clear my concept about map ... XD

  • Hilko kriel
    Hilko kriel 6 months ago +2

    At the rate code is being shortened, by 2020 you’ll type x and your code will intuitively return the meaning of life.
    Btw, the map function is super handy when manipulating arrays for Google Charts.

  • Mustafa Wael
    Mustafa Wael 7 months ago

    Wow, You are awesome teacher 😍😍
    keep going 🏋️

  • No Name
    No Name 7 months ago

    How come your videos don’t have any ads?

  • leamsi2099
    leamsi2099 7 months ago +1

    I am going through freecodecamp javascript course and I always get stuck, they give very short cryptic explanations and when I have to solve an exercise problem I have no idea what I am doing, you break everything down so well, plus your excitement keeps me interested in the content!

  • j l
    j l 8 months ago +2

    I love how weird this guy is. 10:32 i died XD Lol

  • Øath betrayer
    Øath betrayer 9 months ago

    Do Higher Order Functions have to be anonymous?

  • Juan Pablo Ortiz
    Juan Pablo Ortiz 9 months ago

    Saturday morning training for me :)

  • Brett Cooper
    Brett Cooper 9 months ago +1

    Thanks for doing these array tutorials, they really help.
    btw glasses being expensive, did you know, if you know your prescription you can order quality glasses from aliexpress. My latest pair cost $30us delivered, with a titanium frame and polarized lenses. So cheap that they can be more like a fashioned item than a specialty medical device.

    • Daniel Fielding
      Daniel Fielding 2 months ago

      Spending $30 on multiple pairs of glasses because they don't fit your face properly then buying different ones from aliexpress is a false economy :(

    • Daniel Beringer
      Daniel Beringer 9 months ago +1

      good tip

  • fadillah bilqis
    fadillah bilqis 9 months ago

    really helpful, love for the excitement 😁

  • Alan Beltran
    Alan Beltran 10 months ago

    You are such a great teacher 😁👌

  • Hashir Sheikh
    Hashir Sheikh 10 months ago

    how many topics for another time

  • KillersAspect
    KillersAspect 10 months ago

    I genuinely have fun watching him while learning so much!

  • Diastrus
    Diastrus 10 months ago

    How much coffee and energy drinks you drinking before these vids lol

  • Nabeel Javed
    Nabeel Javed 11 months ago

    lmao..... man dont drink too much coffeee

  • Jobo
    Jobo 11 months ago +1

    All the semi colons are unnecessary ;)

  • Jommy Barban
    Jommy Barban 11 months ago +4

    Most enjoyable JS tutorials ever, I don't even need coffee...

  • Lily Ben
    Lily Ben Year ago +7

    Every time I watch a coding train video I'm happy.
    (plus, I can't help myself thinking "This guy is the cutest thing on Earth" lol).

  • Ares Xena
    Ares Xena Year ago +1

    By default my localhost files open in Edge. Couldn't get the results, and began to question whether I'm reading the code in this tutorial correctly. Suddenly noticed he's using Chrome. Guess what happened? The code worked. What lesson did we learn today? Screw Edge for all its purposes.

  • Roman Brandt
    Roman Brandt Year ago

    What kind of mushrooms do you eat bro? )))

  • atpeak 10
    atpeak 10 Year ago

    you are an actor, how did you become a programmer?

  • Gamal Abdall
    Gamal Abdall Year ago

    You are truly a great instructor, I love how you do things, you got me from the first video man.

  • cat linglittle
    cat linglittle Year ago

    watching his video is much more better than reading my textbook

  • Elmir Avdić
    Elmir Avdić Year ago

    Cocaine is one hell of a drug :D Just kidding, excellent energetic and fun video

  • Khoa Nguyen
    Khoa Nguyen Year ago

    love your energy

  • 27svoboda27
    27svoboda27 Year ago

    Good video!

  • Bittu Bhardwaj
    Bittu Bhardwaj Year ago

    hey shiffman which code block used for javascript plzz help i am big fan of u man....keep going man u are increadble

    • The Coding Train
      The Coding Train  Year ago

      This workflow video might help:
      sublime text: thexvid.com/video/UCHzlUiDD10/video.html
      atom editor: thexvid.com/video/d3OcFexe9Ik/video.html
      brackets: thexvid.com/video/nmZbhManVcY/video.html
      codepen: thexvid.com/video/5gfUgNpS6kY/video.html

  • mario1ua
    mario1ua Year ago +1

    Some methods create new array, other change the existing array.
    For example sort() changes existing array.
    Great channel! Thanks

  • Matthias Gohla
    Matthias Gohla Year ago +1

    Best channel besides fun fun function

    • mario1ua
      mario1ua Year ago

      There's third one for me, that's learncode.academy

  • DoreaN cl
    DoreaN cl Year ago

    what about immutability xD

  • Claudio Cortese
    Claudio Cortese Year ago

    To create an array with 100 random elements you can also do : Array.from({length: 100}, () => Math.random());

  • עידן טורקניץ

    I have a quastion: how do you fill an arrey with the numbers 0 to 100?

  • BaronVonTacocat
    BaronVonTacocat Year ago


  • Mércio Filho
    Mércio Filho Year ago

    Thank you!

  • wahhaj asif
    wahhaj asif Year ago

    You are better than elon musk

  • Allen Lowe
    Allen Lowe Year ago

    Try Zenni Optical dude, glasses don't have to be expensive.

  • Doktor Gauß
    Doktor Gauß Year ago

    started with this. Lol

  • Lasse Jönsson
    Lasse Jönsson Year ago

    I really love the way you explain things these things. I understand it so much better now! You are a great teacher! And you are funny! :D I laughed so hard when you hit your glasses to the floor. :D I hope they are okey though. :) Keep this great tutorials coming! / Best regards from a Swedish JS noob :P

  • michezio
    michezio Year ago

    That end though... so rude

  • master computer
    master computer Year ago

    can you make a challenge for Triple T App in google play

  • Jose Andres Alvarez Skinner

    Man I wish I had a teacher like you in the past, like your teaching style, the way you make it look fun, and also have a good time and laughs watching your videos! Thanks!

  • Le Duc Minh
    Le Duc Minh Year ago +1

    well you can just use Array.prototype.fill(...) with an ES6 iffe like
    [].fill((function (arg1) {return...}) ("something"))
    or like
    [].fill((x => sthing...)("some arg"))
    like @avi12

  • Bob Wilkinson
    Bob Wilkinson Year ago

    To the novice Ruby developer, the “arrow function” shorthand makes a lot more sense when compared to the full syntax

  • Jacek W
    Jacek W Year ago +3

    what about

  • coder cat
    coder cat Year ago

    Other way to mutate the items of the array is by using the "entire" argument in map: a.map((x,index, entire) => entire[index] = Math.random()); que

  • Olivair Onkar
    Olivair Onkar Year ago

    You are a genius!!!!

  • Joaquin Stella
    Joaquin Stella Year ago

    Can you make videos about C++?

  • bohdan baranov
    bohdan baranov Year ago

    is there any playlist with all your js lessons?

    • The Coding Train
      The Coding Train  Year ago +1

      Try these!

  • Dario Benitez
    Dario Benitez Year ago +21

    This guy is awesome

  • Giorgio Martini
    Giorgio Martini Year ago

    can u talk more about function composition and factory functions? thx!

  • router inch
    router inch Year ago

    Can you do another coding challenge ?

    • The Coding Train
      The Coding Train  Year ago +1

      Coming soon! (Careful what you wish for, it's 2048 and it's a mess!)

  • avi12
    avi12 Year ago +5

    10:50 You could also do:
    vals.fill((() => Math.random())());
    And I'm pretty sure it'd work the same

    • Ola Kaldestad
      Ola Kaldestad Year ago

      That would set all elements to be the function Math.random, which is probably not at all what you want.

    • Heavy D.
      Heavy D. Year ago

      What about vals.fill(Math.random) ?

    • Ola Kaldestad
      Ola Kaldestad Year ago +1

      No, that does precisely the same as vals.fill(Math.random());