Programming/JavaScript (65) 썸네일형 리스트형 Primitives vs. Objects in Practice let firstName = 'Sunjeong'; let oldFirstName = firstName; firstName = 'Sunny'; console.log(firstName, oldFirstName); // Sunny Sunjeong const sunny = { firstName: 'Sunny', lastName: 'Ryu', age: 35, }; const marriedSunny = sunny; marriedSunny.lastName = 'Y'; console.log('Before marriage: ', sunny); // Before marriage: {firstName: 'Sunny', lastName: 'Y', age: 35} console.log('After marriage: ', mar.. Primitives vs. Objects (Primitive vs. Reference Types) REVIEW: PRIMITIVES, OBJECTS AND THE JAVASCRIPT ENGINE PRIMITIVES Regular Functions vs. Arrow Functions const sunny = { firstName: 'Sunny', year: 1988, calcAge: function () { console.log(this); console.log(2022 - this.year); }, greet: () => console.log(`Hey ${this.firstName}`), // this arrow function does not have its own this keyword. }; sunny.greet(); // Hey undefined Arrow function does not get its own this keyword It will simply use this keyword from its surroundings = its parent's this keywor.. The this Keyword EXECUTION CONTEXT - Variable environment - Scope chain - this keyword - this keyword/variable: Special variable that is created for every execution context (every function). Takes the value of (points to) the "owner" of the function in which the this keyword is used. - this is NOT static. It depends on how the function is called, and its value is only assigned when the function is actually calle.. The this Keyword in Practice console.log(this); // Window {window: Window, self: Window, document: document, name: '', location: Location, …} const calcAge = function (birthYear) { console.log(2022 - birthYear); // 34 console.log(this); // undefined }; calcAge(1988); const calcAgeArrow = birthYear => { console.log(2022 - birthYear); // 34 console.log(this); // Window {window: Window, self: Window, document: document, name: .. Variable Environment: Hoisting and The TDZ EXECUTION CONTEXT - Variable environment - Scope chain - this keyword Hoisting: Makes some types of variables accessible/usable in the code before they are actually declared. Variables lifted to the top of their scope. Behind the scenes Before execution, code is scanned for variable declarations, and for each variable, a new property is created in the variable environment object. HOISTED INITIAL.. Hoisting and The TDZ in Practice // Variables console.log(me); // undefined console.log(job); // Uncaught ReferenceError: Cannot access 'job' before initialization console.log(year); // Uncaught ReferenceError: Cannot access 'year' before initialization var me = 'Sunny'; let job = 'technical writer'; const year = 1988; // Functions console.log(addDecl(2, 3)); // 5 console.log(addExpr(2, 3)); // Uncaught ReferenceError: Cannot a.. Scoping in Practice function calcAge(birthYear) { const age = 2022 - birthYear; function printAge() { const output = `You are ${age}, born in ${birthYear}`; console.log(output); // You are 34, born in 1988 console.log(firstName); // Sunny } printAge(); return age; } const firstName = 'Sunny'; calcAge(1988); console.log(age); // Uncaught ReferenceError: age is not defined at script.js:18:13 내부에서 외부로 접속하는 건 가능 e.g. f.. Scope and The Scope Chain SCOPE CONCENTS - Scoping: How our program's variables are organized and accessed. Where do variables live? Where can we access a certain variable, and where not? - Lexical scoping: Scoping is controlled by placement of functions and blocks in the code; - Scope: Space or environment in which a certain variable is declared (variable environment in case of functions). There is global scope, functio.. SCOPE CHAIN VS. CALL STACK CALL STACK Order in which functions were called SCOPE CHAIN Order in which functions are written in the code has nothing to do with order in which functions were called! SUMMARY Scoping asks the questions "Where do variables live?" or "Where can we access a certain variable, and where not?"; There are 3 types of scope in JavaScript: the global scope, scopes defined by functions, and scopes defin.. 이전 1 2 3 4 ··· 7 다음
