Learn Javascript - 4 "Scope"

창에서 밤하늘을 보는 것과 같은 범위를 생각할 수 있습니다. 행성 지구에 사는 모든 사람은 별의 세계적인 범위에 있습니다. 별은 전 세계적으로 접근 할 수 있습니다. 한편, 도시에 살면 도시의 스카이 라인이나 강을 볼 수 있습니다. 스카이 라인과 강은 해당 지역에서만 접근 할 수 있지만 전 세계적으로 사용할 수있는 별은 여전히 ​​볼 수 있습니다.

블록은 함수가 될 수 있음 :
const logSkyColor = () => {
let color = 'blue';
console.log(color); // blue
}

블록이 If statement에 있을때
if (dusk) {
let color = 'pink';
console.log(color); // pink
}

/global scope/

In global scope, variables are declared outside of blocks. These variables are called global variables. Because global variables are not bound inside a block, they can be accessed by any code in the program, including code in blocks.
Let’s take a look at an example of global scope:

const color = 'blue';
 
const returnSkyColor = () => {
  return color; // blue 
};
 
console.log(returnSkyColor()); // blue

const satellite = 'The Moon'
const galaxy = 'The Milky Way'
const stars = 'North Star'

const callMyNightSky = () =>
{
  return 'Night Sky: ' + satellite + ', ' + stars + ', and ' + galaxy;
}

console.log(callMyNightSky())

/Block Scope/
Variables that are declared with block scope are known as local variables because they are only available to the code that is part of the same block.
블록 범위로 선언 된 변수는 동일한 블록의 일부인 코드에서만 사용할 수 있기 때문에 로컬 변수라고합니다.

const logSkyColor = () => {
  let color = 'blue'; 
  console.log(color); // blue 
};
 
logSkyColor(); // blue 
console.log(color); // ReferenceError

/Scope Pollution/
globally scoped variables can collide with other variables that are more locally scoped, causing unexpected behavior in our code.

let num = 50;
 
const logNum = () => {
  num = 100; // Take note of this line of code
  console.log(num);
};
 
logNum(); // Prints 100
console.log(num); // Prints 100

/Practice Good Scoping/

Tightly scoping your variables will greatly improve your code in several ways:
변수 범위는 엄격하게 지정하기

• 	It will make your code more legible since the blocks will organize your code into discrete sections.

• 	It makes your code more understandable since it clarifies which variables are associated with different parts of the program rather than having to keep track of them line after line!

• 	It’s easier to maintain your code, since your code will be modular.

• 	It will save memory in your code because it will cease to exist after the block finishes running.

Here’s another example of how to use block scope, as defined within an if block:

const logSkyColor = () => {
  const dusk = true;
  let color = 'blue'; 
  if (dusk) {
    let color = 'pink';
    console.log(color); // pink
  }
  console.log(color); // blue 
};
 
console.log(color); // ReferenceError

const logVisibleLightWaves = () => {
  let lightWaves = 'Moonlight';
  let region = 'The Arctic';
  // Add if statement here:
  if (region === 'The Arctic') {
    let lightWaves = 'Northern Lights'
    console.log(lightWaves)
  }
  
  console.log(lightWaves);
};

logVisibleLightWaves();

//Northern Lights (블록 안에서 지정한 log)
Moonlight (블록 밖에서 지정한 log)