JavaScript Trivia With Dev Ed - Who Wants To Be A Megabit

are you interested in seeing how much you know about JavaScript and CSS or maybe you want to see how much dev ed knows about JavaScript and CSS well if so this video is perfect for you because I quiz dev ed in my trivia show on everything JavaScript and CSS related and you can follow along and play along and it is a ton of fun let's get started now hey there my gorgeous friends my name is Edie or actually wait that's Edie over there so welcome dev Edie to the channel we're gonna be doing this new game show he's the very first guest on here so it's gonna be a ton of fun so just introduce yourself real quick edge so everybody knows who you are well thank you so much for the introduction web dev simplifies who simplifies the web for us every day I am my name is Jeff I'm David actually I do stuff on the Internet's I'm not sure what I do but I do stuff creative stuff and yeah I'm very excited to be here with my man well that sounds weird I'm excited to start hopefully I'm gonna do OK in this game and yeah hopefully we'll win the big prize which is a MacBook Pro so hopefully I'm Way too broad for MacBook Pro prizes so I'm sorry but that's that I will hold there's gonna be mad bro oh yeah we'll have to talk to my lawyers about that one but no but that is that is dev ed everybody he's awesome when he actually comes back but I want to explain really quickly kind of the rules of this game before we get started so if you've seen Who Wants to Be a Millionaire this is very similar I'm calling it who wants to be a make a bit because we're all computer nerds here but essentially there's going to be 15 questions which you can see on the right here and they get harder as Edie goes along so the first five are pretty easy the next five are about medium difficulty and the last fiver fairly difficult and he gets one try for every question if he gets it wrong he fails and he loses out but either way we're still going to go through all of the different questions and these lines here represent essentially save points so if ed is on question number eight and he gets it wrong he falls back down to question number five and that's essentially where he ends at and that's what his prizes is what question number five is but at any point if he's on question a and he doesn't know the answer he can just drop out there instead of guessing and he'll get the prize that was at 7 which was his last correctly answered question and these prizes may look a little bit confusing since I'm a broke youtuber and we don't actually make ad money especially right now these prices are actually going to be push-ups instead so it's really more of a punishment for me so down here at the bottom is negative numbers because of Edie somehow misses these easy questions he has to suffer and do push-ups but the more questions he gets right the more push-ups that he's forcing me to do so it's really him punishing me for how well he does which i think is a little bit interesting kind of fun and keeps me from going absolutely broke trying to give him a MacBook Air also there's a MacBook Pro okay oh I don't book her I'm sorry that's even more broke also there's two hints essentially he can use one is 50/50 it knocks out two of the answers that are incorrect so he's left with a 50/50 option and this final one here is Google essentially he gets 15 seconds to Google whatever he wants to try to find the answer and he can use each one of those hints once throughout the run and so any question he can use each one of those since once per run through all of the different questions hmm that'll make sense do you add this but do you mind if if I need to do push-ups if I don't do push-ups but they do squats because I really feel like I haven't been working my kind of my bottom a re I know I'll let you do squats Edie thank you thank you okay I'm ready define up I think you're gonna get through these first five questions no problem so I ready first question here we go this first question is pretty easy it says in JavaScript which method returns a new array based on the results of running a specified action on each element in the original array is this okay reduce for each or transform okay so let's take a look at all of them map first of all it does return in you array and it does go over each element in the array so probably this is gonna be the one but let's go over to the other ones I'm gonna go down for each loops over it but does not actually return us anything so that's probably not it reduce is that weird thing that I still sometimes don't understand but I'm gonna ask you that's not the one and transform it's probably not the one either so if I mess this up first question I'm gonna go with map for the first one because that does return us a new array and yeah let's go with map UA okay you saved yourself from having to do 20 push-ups floor gang okay all right next question in CSS what is the order of the box model from inside out we go content padding border margin content margin border padding content border padding margin or padding content border margin oof okay this is a tough one I told you they get harder so obviously okay from the inside out so we do have content that's what we're starting and then we have padding and then I believe this is where the tricky part of this and the last two with a margin and border actually it's not that tricky because it should come to border and then margin so let me see content padding that's good border should be the one and then margin content margin board your padding funny to say Kenna let's read the answers content patty board okay so I would say contents then the padding comes and then the border and then the margin final answer final answer who doing good you're all the way up to negative 15 push-ups or Scott is this is this is real good all right x-bar a which is the following is not a type in JavaScript is it integer number string or boolean the answer to that is integer correct yes all right don't worry they're gonna get harder which in CSS is based on the size of the screen with VX s w VW or % 5% luck 50% skill I'm gonna go with V it's a great song check it out it's good I'm gonna go with it's hard to say as a non-native English speaker but VW is gonna be the one because we have VH for the heights and we double wait let me read the question again just to be sure based on the size of the screen wit oh wait hold up is it VX no I don't think it's yet cuz the W is for wit so V W is gonna be the final one eww yeah you almost screwed yourself there EDX was a that's not even a real thing I'm sorry it was all okay I like it was I question 5 this is for the save point you no longer have to do squats if you get this right hey no J yes how do you import a module using common J's and I'm not even gonna read these out on my full you look at yes that's finding code is terrible alright so common J s so common j s does not use import that's the first step to know so we're gonna so the bottom left one goes out the window and the bottom right one goes out the window as well we have includes and required so I'm gonna go with require guess that's what I know you better hope this is right otherwise you're doing a lot of push-ups you're correct that is the normal way of doing it in nodejs so the normal way yeah I know tell me about it it's coming soon soon es6 is coming too no Joseph a quality just plug in the headphones I'm sorry I'm listen this is a really professional show that we're running here trust me this is the shortest cable in the world so I apologize man here we go we're on the more difficult question now this is like the medium difficulty so in what order our margin and padding defined in CSS so this is when you define all four of them at once what ordered is a gallon so when I learn CSS I was talking with my mother on how I should learn it and I mean she struggles turning on a computer but she said to me that you should always simplify everything as much as possible in your head so just find something weird that works for you and just go after that logic so my logic when learning this thing was go clockwise from top all the way to yeah clockwise people so it goes top right bottom left right so clockwise so that's my final answer and also I did not have that conversation with my mom that's a lie okay see the way that I remember this is the acronym trouble because spells out in trouble I got that for the West boss so see so everybody has a weird little trick in their head to go after yeah because I forget this all the time until I started thinking Oh trouble okay because when I thought clockwise I was like well does it start with left does it start with right does it start with bottom okay I just know yeah so yes sure sure sure all right next question here eight more code which of the following is invalid JavaScript for importing from a module this one this one's a tricky one oh this is where we're gonna mess it up boys okay you got your clemens let me read the first one so here's where the trickery comes in because you have two different types of imports from you haven't e default imports and you also have this what does it call to get the specified imports or something anyway the way you import a specific thing is you use the curly brackets right alright so in this case we have DT there and if you want to import just kind of not specifically in a default import then you would just give it a random name any name that you want I believe we can name it anything you want but when you're doing a specific import you can also rename it so what am I talking about let me go over the first one import star as n2 see that's tricky there because I and I'm not sure if if you can rename everything as something you have a specific import their tea alright so uh so that might be invalid but let me let me look at the other one so import n that looks fine because it's a default import and then you have tea which is a specific one and then you can rename it to anything you want so that looks good to me the third one looks good to me too because you just have a default import and a specific import and then the last one imports of what the hell what what what's that thing there M for it default is oh yeah that should work too okay I'm gonna go with the first one being invalid final answer title oh you got it uh-huh oh that this one's a tricky one so this import default down here is actually the same as like saying import end to so like you can import to the default export by using the keyword default I did not know that before writing this question impressive not gonna I this one this one's not a sure q1 what and I'm not gonna I can't go ahead yeah you're just you're just a dev not a developer what is the result of 100/0 in JavaScript is it not a number zero it throws an error or infinity oh no oh no yeah I had the nightmare about this last night so I see I have I would have to say either a zero or not a number so either of those two I think but to simplify not the web the question I think I'm gonna go with a 50/50 on this one because it's empty and hopefully I'm gonna get either the zero or none we'll see oh okay I don't think it's infinity I'm gonna go with zero final answer final answer it'll be this is known what I ran into this like two weeks ago at work and I was like I was doing a hundred divided by and it turned out zero and I was like infinity what and I was like this is a perfect question wow wow wow okay yeah do you like that well if I'm pretty sure if you do 100 divided by negative zero you get negative infinity or if you do like negative 100 divided by zero you get negative infinity javascript is good that's so weird so oh whoa failed you failed and went all the way down to winning zero push-ups so congratulations but we're gonna keep going we're gonna finish out all the questions to see how good you actually do and you still remember have this Google hint which maybe would have been a better choice in 5050 yeah probably probably I'm still gonna do squats after this question right what is the correct way to check for not a number in JavaScript oh my got gonna bother reading code because that's terrible oh my goodness my debugging skills have always been terrible so I this is something I would not really do anyway so it's I'm probably gonna I'm just gonna look at the one that I think looks cool and I'm gonna go with that one so let's see was not how to check if it's not a number I'm gonna go with ten triple equals not a number final answer oh that looks okay to me yeah nope oh my god never the other sit yeah I hate this function because every time I write it I write lowercase n for the third letter because I think capital n a n but its capital uh twice and I messed this up all the time so this is why I had to put this in here I think I wrote that like twice God existed all right this is where it goes downhill everybody yeah everybody's gonna start unsubscribing from you after I stopped thinking that wow this this guy doesn't any vote Jonathan geez what is this alright this one this one's a tricky one which is the most popular browser is it Safari for iOS Firefox Chrome for Android or Chrome for the desktop I think either Chrome now the question is is the mobile version more popular than the desktop version that is delicious I don't think Safari for iOS because it's not bad many people using Safari and people I mean even people who have Macs and everything as Aria is not that great anyway so so that goes out Firefox is getting better in gaining popularity but I don't think it's as popular as Chrome I think Chrome is the most popular one ooh is it Android or desktop wait let me think if you have an iPhone let's assume that most people are not gonna install Chrome oh but it's for Android anyway okay let's just look at the Android Market does Chrome come pre-installed on phones I think it does I think it does on some phones like the Google pixel probably comes installed on it but I don't think like I have the same song and I don't think it installed on my samsung phone has no bad browser and usually and I learned that first thing I did was install Chrome oh this is a tough one I'm gonna do a switcheroo here I'm gonna see desktop but I'm probably wrong it's probably Android yeah you're wrong yeah yeah it's it's actually fairly close I think Android Chrome for Android about 10 percent more popular than the desktop version so hmm mostly because like Firefox doesn't have a mobile app there's really no mobile browser other than Chrome that's good yeah so yeah yeah and yeah Safari for iOS is like very low it is low it's like one tenth of Chrome for Android which kind of surprised me except they're good quite a few people use Safari on iPhones but should they guess the tips Doc Brown because more people are using phones now than desktops yeah yeah it nobody beats so so now we're getting to the actual hard questions are bad which of the following is false I hate you this one's a super trick question empty string equals false all right so I don't think that's the one and I just hear your your brain melting right now oh my god if I was a Google search this I will then how much time do I have on my Google search 15 seconds yeah there's no way I'm gonna find that answer you gotta open up the console just start typing these in real quick oh yeah sure sure all right let me pull up her whole life let me know when you're ready you ready I'm not ready hello f12 I get a bunch of errors okay give me a countdown I know you're going already oh-ee time all that are eight seven six five four three two one time's up oh you figured out right I wrote it too man double equals man with two ends so I have not figured I just read the first one so you know it's not the first one then well we know the first one is true okay so I'm gonna sense I'm going to use my magic a mentalism skills false triple equals false I'm gonna that looks like something that would be true null I think it's the null he double equals undefined I'm gonna go with that one this one finally yeah yeah no no I need to do some research on not a number yeah this was this is why they have that is not a number function is because nama number doesn't actually equal not a number which is Oh dumb but yeah see I don't yeah i probably angry me this this is what you have to look forward to for the rest of the questions they are they're tough how do you name a grid line in CSS so this is like when you create template columns how do you give it a name for that column okay let's see 1fr name I don't think it's with the arrows so that goes out the window see there with the oh there's the kama ting oh my goodness that's no that's awful you cannot believe how many times I messed up Dee it was it that ya grid template columns and you do the min/max thing you know it's like a dash or comma there somewhere and I always mess it up I never know how it is I always mess up commas and CSS functions because some of them have commas some of them don't have commas I'm like make up your mind dammit it's like it has no commas but you know the functions have commas so I don't think there's a bracket over one f4 I'm like a hundred percent sure I'm not sure if that changes based if you give it the name but I don't think so I'm pretty sure when you do like one or whatever you don't do brackets a hundred percent sure and that I'm wrong and everybody left it's either the left top one or the bottom for them left one I don't think it's the curly bracket one because it's using square brackets my bad I think it's the bottom left one it's the another yeah yeah that print that was meeting this one yeah the parenthesis yeah let's go with that one no you're suppose so close thank you you have the min max and all this stuff and I remember parenthesis only not curly brackets oh I'm terrible in time to just retire now ed yeah yeah so this is where this is where you know that I use Google a lot you should Google a lot as well I had to google a lot to make some of these questions especially some of these harder ones I here's another tough one which doesn't function return' if you pass in to as X so essentially f 2 here for X so you got X plus plus then this fancy equals stuff so some hated operators more pluses more minuses it's confusing but your answers are 1 2 0 or negative 1 okay all right so we're passing in 2 and X so we have function FX all right so two we increase two by one so that should be 3 so we have 3 equals 3 minus 3 ah interesting so the tree I'm gonna I'm gonna guess like this so 3 equals 3 minus 3 which is 0 which is false three equals zero or what's happening there no and then you say and and then you do a plus plus before it then you return it with the my your sneaky sneaky little guy here little okay so Wow are we returning here this one's really tough this one is really tough so we have tree equals three minus three which is 0 and do we still have tree for holy holy all right I haven't even looked at the answers yet but I'm gonna assume I have what do I have you have a number between negative 1 & 2 [Laughter] okay zero I'm gonna do I'm gonna do 0 no that's zero I cannot explain why I'm doing zero but I'm doing zero all right and then yeah I always get mad yeah okay so so the way that this works it's kind of tricky so you got the X here so X plus plus changes 2 to 3 which is correct and then we're setting X to what currently X's which is 3 minus 3 which is zero so now X is 0 here and 0 is false so you recorrect you skip this section because short-circuits out and then you have arrow - - but the - - happens after the return c return 0 so yeah yeah you had some smart logical this one was tricky cool that was tricky so hey you know you broke the long streak over here of not so correct answers I was really confused like whether the returns here like either 0 or minus 1 I wasn't sure if it actually takes one down there yep yeah no I it's this tricky i I had to play this with this one in the browser quite a bit to just make sure I had my head wrapped around it it's really this is what you get in my coding interview questions and you're like why do I need to know this I'm never gonna use this until the tile pulls beyond his trivia show or a go and I with a bang let's go how do you define multiple transitions in CSS more common stuff for you to worry about it's pretty much the only difference between all these mm-hmm all right let's see you yeah you defined the property name first another property name I mean like the width or height or whatever you want to transition then you give it the seconds and then comma and then you give another property if you want and two seconds let me look at the other ones first the first one yeah I don't think you define it like that like with comma height one second now that doesn't look it with height and that doesn't look good either and definitely not the bottom right ones so I'm gonna go with the bottom left one because I that's how you remember that I wrote it a lot of times let's go with that one that is correct that was good that was good this one was a little bit of tricky one for me when I was writing it out because I always forget like how do you do multiple transitions that are different I just don't do it very often so I never ever think about it I wish these questions were sue their questions are easier than the the middle ones too could it be next episode I'm a deep bond Kyle okay do this one this one may be the hardest we'll see what is the most searched term on can I use calm okay this one I like that final answer yeah yeah that's right so this one's a bit of a little bit of a trick question because I would assume grid when looking at this because I mean what's box has been around for so long it's like 98% use but apparently people are still searching for flux bucks that are stuck in Internet Explorer 6 land or something you know how I know this I searched for like life every day then I think I've read the CSS tricks article on flux pots probably a hundred times because I would always go to that any time I was like how do I send her something how do I write a line at a CSS tricks fluxbox article saved my life like three years ago the first job I was working at I kept pushing people to use flexbox and the boss didn't want to use flexbox I'm like it's very compatible already so I would check every day for that percentage to keep going up yes how I'm maybe that's why so many people check out there just waiting for internet explorer to like finally tick over there like please Microsoft save us we ended up using bootstrap tree or some crap by the way hey we ended pretty well huh yeah it looks like you got ten ten correct five wrong that's that's not bad at all especially because some of these you know hard ones are really hard needed good you got three of the hardest ones right which is hey that's impressive hey so sand them no MacBook Pro no no no no Microprose right and the best part for me is since you failed out right here and you didn't actually like walk away I don't actually have to do any push-ups because we failed on the zero mark so this is this is great for me I don't get to watch you do squats which is kind of not so fun I wanted to see you suffer through squats but not like this is the best video I can do five just because they really want to do five and you can add this in the final episode Evernote oh I'm a nerd and everybody's gonna see this I'm not gonna turn around because we still want Kyle to make money from mom yeah I want to be monetized please do not note or tails unfortunate because okay how many am i doing five let's do ten because let's do ten overachiever this is the true dev ed this is say he failed so many programming problems he decided he's gonna do a fitness choice this is this is deadlifts three four can you do the one one leg or this is something people don't do oh five that's pretty impressive those are hard and I've done those before seven eight nine and ten I'm also gonna give you a few push-ups because we need stay healthy and look at this step guy this is this great all right here we got my sandals one that simplified to that simplified three four five six so do the clapping thing that we didn't have to watch a faceplant though are you nice job outs for the rest of the month hey the month just started here once again I'm a mess I'm sorry okay good I was impressive I like the one legged squat those are hard alright can I breathe awesome well Edie congratulations on making it through ten of the questions correctly that's pretty impressive I'm good I'm curious to see how you stack up against future contestants I'm curious to see if you are the top you know with the ten questions right or if you're the bottom I don't know we'll see we'll see kind of kind of wait to watch I'm super excited handsome so thank you very much for coming on it i if this was a ton of fun I've laughing the entire time so this was absolutely great I really hope the audience enjoyed this as well and I hope to do more videos like this and if you have suggestions for other youtubers or developers you want me to bring on let me know in the comments below and I would love to just bring on whoever you want so please let me know anyone you're interested in having me bring on well like I said at the beginning this video was a ton of fun to make and I want to say thank you again to dev ed for coming out and joining me on this trivia show if you enjoyed this make sure to let me know down in the comments so I can bring on additional guests and let me know who you'd want me to bring on thank you very much for watching and have a good day

Channel: Web Dev Simplified

Views: 57,780

Rating: 4.9661531 out of 5

Keywords: webdevsimplified, javascript trivia, javascript interview questions, js trivia, js game show, js interview questions, js trivia game, javascript trivia game, css trivia, css quiz, javascript quiz, js quiz, js quiz game, css quiz game, web dev trivia, web dev quiz, web development quiz, web development trivia, dev ed, dev ed trivia, who wants to be a megabit, trivia game web dev, javascript questions, css questions, javascript tutorial, css tutorial, js, css, javascript, html

Id: RtVt--kt6AI

Length: 31min 54sec (1914 seconds)

Published: Tue May 26 2020