TIL: Today I Learned37 [TIL] 20201211 Async JavaScript The Call Stack Definition The mechanism the JavaScript interpreter uses to keep track of its place in a script that calls multiple functions. How JavaScript 'knows' what function is currently being run and what functions are called from within that function, etc. Some sort of "bookmark" How it works When a script calls a function, the interpreter adds it to the call stack and then starts carryin.. 2020. 12. 13. [TIL] 20201210 The Missing Piece: DOM Events Events User inputs and actions Inline Events Not recommended (Can't reuse the code, making it hard to modify) Example : click Click onclick Property Function runs when the element is clicked Syntax const el = document.querySelector('element'); el.onclick = function() { //code } onmouseenter Property Function runs when mouse cursor enters into the element. addEventListener Specify the event type .. 2020. 12. 10. [TIL] 20201209 Introducing The World of DOM DOM Document Object Model JavaScript representation of a webpage. It's a 'window/portal' into the contents of a webpage Document Object Web Browsers take incoming HTML & CSS and create corresponding JavaScript Objects. Entry point into the world of the DOM Contains representations of all the contentson a page, and other useful methods and properties. How to Select the Object getElementById Singl.. 2020. 12. 9. [TIL] 20201207 Newer JavaScript Features Default Parameters The Old Way To set a default parameter, the developer had to check if the parameter is set by the user, and then set a parameter when it isn't Example function rollDie(numSides) { if(numSides === NaN){ numSides = 6; } return Math.floor(Math.random * numSides) +1; } The New Way Set the default parameter in the parentheses Example function rollDie(numSides=6){ return Math.floor(.. 2020. 12. 8. [TIL] 20201205 Callbacks & Array Methods Callback A callback is a function that is passed as an argument to another function forEach Method An array method Accepts a callback function Calls the function once per element in the array. (Very similar to for...of) Syntax arr.forEach(func) map Method An array method Creates a new array with the results of calling a callback on every element in the array. Syntax arr.map(function (el) { //cod.. 2020. 12. 5. [TIL] 20201204 Leveling Up Our Functions Scope Variable 'visibility' Impact of the variable The location where a variable is defined dictates where we have access to that variable Function Scope Defined inside of a function Visible only inside of the function Block Scope Defined inside of a block (i.e. conditionals, loops...) Visible only inside of the block If var is used to make variables, they are visible outside of the block, which.. 2020. 12. 5. [TIL] 20201203 Introducing Functions Function Reusable procedures Allows us to write reusable, modular code We define a "chunk" of code that we can then excute at a later point. How to define a function function functionName() { //code } Argument Inputs that functions accept Syntax //argument === parameter function functionName(parameter){ //code } Functions with multiple arguments function functionName(param1, paramN){ //code } //.. 2020. 12. 3. [TIL] 20201202 Repeating Stuff with Loops Loops Allows to repeat code There are multiple types for loop while loop for ... of loop for ... in loop for Loop Syntax for ([initialExpression]; [condition]; [incrementExpression]){ //code } Example for (let i=1; i 2020. 12. 2. [TIL] 20201201 JavaScript Object Literals Objects Collections of properties Property is a key-value pair Rather than accessing data using an index, we use custom keys. Creating Object Literals Syntax const obj = {key : value} Example const human = { firstName : 'Jiwan', lastName : 'Kim' } Accessing Data Out of Objects Syntax obj["key"] obj.key Examples human["firstName"] //Jiwan human.lastName //Kim Keys All keys are converted to string.. 2020. 12. 1. [TIL] 20201130 JavaScript Arrays Data Structure A collection of data Arrays Ordered collections of values. Examples List of comments on IG post Collection of levels in a game Songs in a playlist Ways to Create Arrays const arr = []; const strArray = ["orange", "red"]; const numArray = [1, 2, 3]; const mixedArray = [true, "orange", 32]; Array Random Access Array Index Each element has a corresponding index, counting starts at 0... 2020. 12. 1. [TIL] 20201127 JavaScript Decision making Decision Making with Code Boolean Logic : Having different outcomes depending on different criteria. Comparison Operators Has true or false output. > : greater than = : greater than or equal to 2020. 11. 27. [TIL] 20201126 JavaScript Strings and More String Represents text Must be wrapped in quotes, either double or single. Warning : 23 ≠ '23' let username = "Jiwan"; let username = 'Jiwan'; let username = 'Jiwan"; //error String Index Strings are indexed. Each character has a corresponding index (positional number) Index starts at 0. String Length Length of index. (Index of last letter) + 1 = Length String Concatenation Put multiple strings .. 2020. 11. 27. 이전 1 2 3 4 다음
