JavaScript Pure Functions - Tutorial for beginners

Поділитися
Вставка
  • Опубліковано 27 чер 2024
  • Pure Functions are an essential ingredient of functional programming, regardless of the language. In this video we cover the two major rules that make any function pure, benefits of pure function, as well as why some functions can't be pure. Let's have some fun yo!
    This is episode 16 of 20 things Javascript Developers Should Know But Probably Don't.
    00:00:00 Intro
    00:01:15 What is a pure function?
    00:01:52 Rule #1: Same input means same output
    00:02:58 🔴 Live coding: Rule #1
    00:08:37 Benefits of Rule #1
    00:10:04 Testability
    00:12:05 Rule #2: No side-effects
    00:12:22 🔴 Live coding: Rule #2
    00:15:07 Benefits of Rule #2
    00:16:40 Impure functions 😱
    00:18:17 Outro
    ColorCode Etsy Merchandise store:
    www.etsy.com/shop/ColorCodeStore
    Full playlist here: • 20 Things JavaScript D...
    JavaScript Promises from the series "20 Things JS Developers Should Know but Probably Don't"
    by ColorCode.io, Sina Jazayeri
    ** Announcement **
    Full JavaScript Mastery course is coming! Sign up for Early Access here:
    www.colorcode.io/js-mastery
  • Наука та технологія

КОМЕНТАРІ • 152

  • @ColorCodeio
    @ColorCodeio  4 місяці тому +28

    Episode 16: Pure Functions 🤘👨‍💻🔥🎉

    • @sergiu6650
      @sergiu6650 4 місяці тому +4

      Well done .. Craig!, Can you post more often ? :D Maybe some React stuff ?

  • @zero11010
    @zero11010 4 місяці тому +12

    The song: counting bodies like sheep to the rhythm of the wardrums
    Performed by: a perfect circle
    I love your music references. 👍

  • @javeedakhter324
    @javeedakhter324 4 місяці тому +13

    Javascript legend 🎉👍

  • @ALENonEIC
    @ALENonEIC 4 місяці тому +3

    Honey, wake up. ColorCode posted a new JavaScript video.

  • @mohammadabbas1623
    @mohammadabbas1623 4 місяці тому +5

    Oh man, we need a video editing tutorial as well 😛🤩

  • @JohnnyDiabetes
    @JohnnyDiabetes 2 місяці тому +1

    ...when you find out your nascent skillset/hobby comes with a UA-camr that makes incredible content with clarity, humor, style, and beauty. And you just wish you could make him understand how much you appreciate him...
    Thank you, Sina. You're like that indie film that is so special that you want everyone to see it and love it as much as you do. You're my developer-resource version of 'Sing Street' (2016). Or maybe 'You Can Count On Me' (2000).
    [digital gratitude hug]

    • @ColorCodeio
      @ColorCodeio  19 днів тому

      Thank you for the love, Johnny! Made my day. Great comment.

  • @mikeJohnson2222
    @mikeJohnson2222 4 місяці тому +2

    Bro thanks... The way you break down the entire language is awesome.

  • @beinyourguard
    @beinyourguard 4 місяці тому +4

    Sina I LOVE your way of teaching, it's just so simple, entertaining and helpful

  • @4rmboy666
    @4rmboy666 4 місяці тому +5

    You know you have the perfect combo. The videos are both interesting and useful.

  • @opsingh861
    @opsingh861 Місяць тому +1

    Intro and editing was on the next level 💥💥💥💥

  • @amsxiety
    @amsxiety 4 місяці тому +4

    Best conceptual coding videos ❤

  • @hessamt800
    @hessamt800 4 місяці тому +2

    Hats off to you, nice to have you back.

  • @NikolayVeselinov
    @NikolayVeselinov 4 місяці тому +2

    Alright, im ready for the next video, keep em coming!

  • @Tarek_Abdelhafez
    @Tarek_Abdelhafez 4 місяці тому +3

    Welcome back with long waiting videos. Please continue. 😀

  • @aj_hari_7
    @aj_hari_7 4 місяці тому +1

    We need consistent videos from Sin Jazzz 🎉

  • @Thassalocracy
    @Thassalocracy 4 місяці тому +2

    This video should be a preparatory course for React beginners 😏

  • @franexmo81-
    @franexmo81- 4 місяці тому +2

    Brief, simple, clear and fun.
    Thanks for this amazing learning material

  • @nirau
    @nirau 3 місяці тому +3

    So happy to found your channel, it makes my frontend developer study journey so much better! Cheers

  • @chhavimanichoubey9437
    @chhavimanichoubey9437 4 місяці тому +1

    My favourite online coding teacher is back

  • @sugarfairy1248
    @sugarfairy1248 3 місяці тому +1

    Love your style of video editing and how you present the concepts in such a fun way! You deserve much much more subscribers!

  • @MeetPatel_01
    @MeetPatel_01 2 місяці тому +1

    i been browsing advanced Js tutorials all around, i got few but sounds boring, i really appreciate the energy you got while explain things, totally love it, can't wait for more content.

  • @user-kn4oi9oh4i
    @user-kn4oi9oh4i 3 місяці тому +1

    Best. Intro. Ever. ❤

  • @krypton_dev
    @krypton_dev 4 місяці тому +3

    Thank you sinaaaa ❤

  • @kiranshelar2961
    @kiranshelar2961 2 місяці тому

    Best content for understanding difficullt javascript concepts! Thankyou

  • @val-do
    @val-do 4 місяці тому +1

    Your edits are awesome

  • @junhuama68
    @junhuama68 4 місяці тому +1

    Thank you so much! This is pure and simple to understand! Nice haircut! SO SO SO Looking forward to the next episode!!! Thank you again!!!!

  • @alexngiifamily
    @alexngiifamily 4 місяці тому +1

    I am in Love with your explanations Bro. It's Amazing.

  • @DevCoder
    @DevCoder 4 місяці тому +1

    Welcomeee baaack🔥🔥🔥🔥

  • @jonathanserwano9948
    @jonathanserwano9948 2 місяці тому +1

    man you are the best at acting and explaining complex stuff for me, i really enjoy your videos

  • @tonyhomfray
    @tonyhomfray 3 місяці тому +1

    You’ve explained pure functions in a way that I finally understand! 🎉 Thank you! 🙏🏼
    Loving this whole series ❤ I found it searching for the Fetch API and have been back to watch the whole series 👌🏻

  • @kbkmn
    @kbkmn 4 місяці тому +1

    great video as always. i think that you should address that functional programming is often about higher order functions and state separation

  • @SebastianFinkel
    @SebastianFinkel 4 місяці тому +1

    Nice one! ❤

  • @hollam224
    @hollam224 3 місяці тому +1

    Love you soo much
    your tutorials are first class

  • @chetansingh575
    @chetansingh575 4 місяці тому +1

    Thank You for this video. ❤

  • @BigBabyofTel
    @BigBabyofTel 4 місяці тому +2

    Your style of teaching is effective. I hope you get the energy to do something similar with Typescript. This series on JS is already one of the best ones on YT

  • @davidag90
    @davidag90 4 місяці тому +2

    Someone has been watching "Succession" hahaha hahahaha. Thanks a lot Sina, your content never let me down. Cheers!!

  • @ianfrye8988
    @ianfrye8988 4 місяці тому +1

    Also the no side effects is so important in state management and the core concept of libraries like redux. Never modify state directly. Only return an updated state

  • @dhiflaouibelgacem8146
    @dhiflaouibelgacem8146 4 місяці тому +1

    Thank you for your efforts

  • @bmehder
    @bmehder 4 місяці тому +1

    The best tutorials.

  • @keja5512
    @keja5512 Місяць тому

    Pure presentation of Pure func👍👍

  • @sam_6480
    @sam_6480 2 місяці тому +1

    Such a wonderful tutorial ❤ Would you do an episode about design patterns and maybe software testing in the future?

  • @ajayrathod6946
    @ajayrathod6946 23 години тому

    one of the best explaination i saw in the youtube 😄, Which code editor are you using?

  • @himalayanmonk3350
    @himalayanmonk3350 28 днів тому +1

    Good sir , you are a gentleman and a scholar ❤

  • @maannikita
    @maannikita 4 місяці тому +1

    hey, I love your teaching style. please make a video on Garbage collection and circular referenced objects.

  • @hilariousness4393
    @hilariousness4393 4 місяці тому +1

    I was hapoy to see you in my notification panel

  • @NadaII
    @NadaII 4 місяці тому +1

    Coding fact: If you write a function that sets the CSS variable for Sina's hair to 'hidden' and attach an onClick, you can transform him into Stanley Tucci. Add a 0.5s ease-in-out for a smoother transition.
    This is based purely on the thumbnail to this video btw..

  • @ianfrye8988
    @ianfrye8988 4 місяці тому

    One reason I love typescript. It catches a lot of this

  • @GiggleSnips
    @GiggleSnips 4 місяці тому +1

    Your videos are really great ❤ thankyou.
    I request you plz do videos on React Hooks

  • @creed_forever
    @creed_forever 2 місяці тому +1

    So creative representation.

  • @PhantomDeluxe1111
    @PhantomDeluxe1111 10 днів тому

    Hey Sina! Wonderful video can youu tell me which editing software you use to edit your videos? Wow come on man sick editing!

  • @215Leon215
    @215Leon215 4 місяці тому +1

    Been waiting so long for this series to continues! So glad that your back!

  • @mohamadhag6338
    @mohamadhag6338 Місяць тому

    The inventor of fun JavaScript:

  • @BSEFM-MUHMMADFARAZALI
    @BSEFM-MUHMMADFARAZALI 4 місяці тому +1

    Great Job Sina! Amazing content.👑 Kindly post react content as well

  • @user-ej6lu1kx7p
    @user-ej6lu1kx7p 4 місяці тому +1

    Javascript legend is back 🥳🥳🥳🥳🥳🥳🥳🥳🥳🥳

  • @renzodiaz5996
    @renzodiaz5996 3 місяці тому

    I hope we get a "Qoli" face reveal by Episode 20 :)
    Awesome video man!

  • @karlstenator
    @karlstenator 4 місяці тому +1

    It can be argued that a function executing a console.log is an impure function, as its side-effect is writing to the console.

  • @RostyslavNazarenko
    @RostyslavNazarenko 3 місяці тому

    Can we have a video in unit testing? But I'll probably learn it by myself till then) but I love your videos and type of teaching, and of course, I love you ♥😍😍

  • @amirkishk
    @amirkishk 4 місяці тому +1

    Finally 🎉🎉🎉🎉🎉

  • @sebastianguerrero5629
    @sebastianguerrero5629 Місяць тому

    Hi Sina, amazing work bro
    I would like to suggest this topics for future videos:
    💎 Getters and Setters
    💎 Short circuit operator
    💎 Event Propagation
    Thanks for the quality of the content, greetings from Colombia

  • @ciprianparaschiv7591
    @ciprianparaschiv7591 4 місяці тому +1

    Salut to you as well, from Romania. Great series, my dude. You could fit right into a real brick-and-mortar University as a cool JS teacher.

    • @sergiu6650
      @sergiu6650 4 місяці тому

      Salut tot din Romania.

    • @ColorCodeio
      @ColorCodeio  4 місяці тому +1

      Hello Romania! 🇷🇴

  • @davidvernon3119
    @davidvernon3119 4 місяці тому

    Great video, great singing. I would add that while you can write pure functions in JavaScript, the language doesn’t support them the way some fancier languages do. For example in rust all functions are pure by default and the compiler guarantees this and you have to declare your intentions to be impure (to sin) by including self as an argument.

  • @behindthescene4406
    @behindthescene4406 4 місяці тому +1

    I been waiting since long 😭😭😭😭

  • @Diego_Cabrera
    @Diego_Cabrera 4 місяці тому

    Sir you’re an amazing teacher. I aspire to be as clear and concise with my videos as you are. May I ask how you do you color grade your videos (lut or preset?) bc they’re beautiful. Also how do you edit your self right beside your editor? Is it a template for your screen recording or editing software?

    • @ColorCodeio
      @ColorCodeio  4 місяці тому

      It's got more to do with lighting and a good lens than software. Watch some tutorials on lighting before getting into LUTs, then you can do color correction based on your environment.

  • @opencode1
    @opencode1 4 місяці тому +1

    wooooooohoooo you da best :))))

  • @raghavenderkuppireddy7158
    @raghavenderkuppireddy7158 4 місяці тому +1

    Waiting ... && ❤❤❤🎉🎉🎉

  • @cholo2605
    @cholo2605 4 місяці тому +1

    GOAT!

  • @ivo_sa
    @ivo_sa 4 місяці тому

    when is your course dropping ? cant wait!

    • @ColorCodeio
      @ColorCodeio  4 місяці тому

      Working on it as we speak. Make sure you join the list on www.colorcode.io

  • @puyakhalili
    @puyakhalili 4 місяці тому +1

    Amazing video thanks a lot Sina. BTW how do you get the code continuously running on the right pane? is that Quokka ? and how do you get it to run in a separate column?

    • @ColorCodeio
      @ColorCodeio  4 місяці тому +1

      It's called RunJS - Here's my affiliate link: runjs.app/colorcode

    • @puyakhalili
      @puyakhalili 4 місяці тому

      @@ColorCodeio Wow incredible! Thanks Sina :) BTW I love the Gholi cameos in your videos! Our beloved childhood friend ;)

  • @denisveli9465
    @denisveli9465 2 місяці тому +1

    Thank you for the amazing content!
    Sorry about the awkward questions but I really like you glasses. Could you tell me the brand and the model, please?
    Thank in advance and keep up with the videos you're doing!

    • @ColorCodeio
      @ColorCodeio  Місяць тому

      www.warbyparker.com/eyeglasses/dawson/azure-crystal-with-oak-barrel

  • @RobertMcGovernTarasis
    @RobertMcGovernTarasis 4 місяці тому +1

    Really curious, what is the tool you are using for the live coding? Looks useful, particularly for learning / testing ideas.

    • @ColorCodeio
      @ColorCodeio  4 місяці тому

      It's called RunJS. Here's my affiliate link: runjs.app/colorcode

  • @IlPandax
    @IlPandax 4 місяці тому +1

    You deserve a lot more credits for your videos. ;)
    Anyway, may I ask a video about the semi colon? Is it good, is it bad, why was removed... :D

    • @ColorCodeio
      @ColorCodeio  4 місяці тому +1

      I don't use them in these tutorials just to make things a little cleaner, and it doesn't really have an impact with some rare exceptions in return statements

    • @IlPandax
      @IlPandax 4 місяці тому

      @@ColorCodeioAh ok! Thanks! :D

  • @creed_forever
    @creed_forever 2 місяці тому

    Rule 1 : one-to-one relation

  • @user-vo8hn7yj7z
    @user-vo8hn7yj7z 4 місяці тому

    Hi, Please let me know how to use spotlight effect on Mac mouse, thanks!

  • @asi7377
    @asi7377 3 місяці тому

    what code editor you are using? i want that simplicity

  • @shinigamiryoutaro
    @shinigamiryoutaro 4 місяці тому +2

    He actuallyt made me drink water.. thanks yo

  • @paternyao
    @paternyao 3 місяці тому

    Starting at 3:00, how do you access this clear code editing space in the browser? Which browser is it? How do I access this window? It’s so clean!

  • @CLeovison
    @CLeovison 4 місяці тому

    Can you please do a video about side effect?

    • @ColorCodeio
      @ColorCodeio  4 місяці тому +1

      I cover side effects in this video

  • @endfine9230
    @endfine9230 3 місяці тому

    I came looking for copper and found gold

  • @copytopgrade6458
    @copytopgrade6458 4 місяці тому

    hello, what font do you use ?

  • @shahidshafi1227
    @shahidshafi1227 4 місяці тому +2

    Extension for console??

  • @ardavural4649
    @ardavural4649 4 місяці тому

    where is ur podcast :(

  • @badr5465
    @badr5465 4 місяці тому

    aleluya! hehe

  • @longingbydesign
    @longingbydesign 4 місяці тому

    "JavaScript
    MasterClass
    Available Spring 2023" ...

  • @djhi-tek9249
    @djhi-tek9249 4 місяці тому

    Are you a syrian living in turkey ?

  • @PooriaHana
    @PooriaHana 2 місяці тому

    salut('Logan') never can be a pure function! It can unexpectedly return "Fu*k off" :))

  • @fukkoff2024
    @fukkoff2024 3 місяці тому +1

    Your videos are absolutely 🔥. Dude, dope a$$ jacket 🫡

  • @mohamadhag6338
    @mohamadhag6338 Місяць тому

    The inventor of fun JavaScript: