Part. 5 Scope, 객체지향, 매개변수

백현-Un village

Scope : 변수 접근 규칙에 따른 유효 범위

• 변수는 어떠한 환경 내에서만 사용 가능하며, 프로그래밍 언어는 각각의 변수 접근 규칙을 갖고 있다.
• 변수와 그 값이, 어디서부터 어디까지 유효한지를 판단하는 범위
• Javascript는 기본적으로, 함수가 선언되는 (lexical) 동시에 자신만의 scope를 가진다.

- Local socpe vs. Global scope

• scope는 중첩이 가능하다. 함수 안에 함수를 넣을 수 있다.
• Global scope는 최상단의 scope로, 전역 변수는 어디서든 접근이 가능하다.
• 지역 변수는 함수 내에서 전역 변수보다 더 높은 우선순위를 가진다.
• 하위 scope가 상위 scope의 변수 접근 가능

_let greeting = 'Hello';
function greetSomeone () {
  let firstName = 'Josh'; 
  return greeting + ' ' + firstName;
}_ 
// function부터 return 까지 Local scope 

greetSomeone(); // 'Hello Josh'
firstName; // ReferenceError

_// 처음부터 끝까지 Global scope

let name = "Richard";

function showName () {
  name = "Jack"; // 전역 변수
  // 선언 (let)이 없기 때문에, 바깥 scope에 있는 name이라는 변수를 가져온다
  console.log(name); // Jack
}

console.log(name); // Richard
showName();
console.log(name); // Jack

Function Scope vs. Block Scope

• Block : 중괄호로 시작하고, 끝나는 단위
• Javascript는 기본적으로, 함수 단위로 자신만의 scopr를 가진다. (var 키워드)
• Block 단위로 scope를 구분했을 때에 예측하기 쉬운 코드를 작성할 수 있다. (let 키워드)
• 값이 변하지 않는 변수, 즉 상수를 정의할 때 사용하고 let 키워드와 동일하게 Block Scope를 따른다. 값을 재정의하려고 하면 TypeError를 낸다. (const 키워드)

let 키워드 : 유효범위 Block Scope, 값 재정의 가능, 재선언 불가능
const 키워드 : 유효범위 Block Scope, 값 재정의 불가능, 재선언 불가능
var 키워드 : 유효범위 Function Scope, 값 재정의 가능, 재선언 가능

전역 변수와 window 객체

• 함수의 외부에서 선언된 모든 변수는 전역 범위
• 전역 범위를 대표하는 객체: window
• Global Scope에서 선언된 함수, 그리고 var키워드를 이용해 선언된 변수는 window 객체와 연결

var myName = "Paul";
console.log(window.myName); // Paul

function foo() {
  console.log('bar');
}

console.log(foo === window.foo); // true

선언 없이 초기화된 전역 변수

function showAge() {
  age = 90; 
  console.log(age);
}
showAge(); // 90
console.log(age); // 90

HOISTING

• 변수 선언은 범위에 따라 선언과 할당으로 분리됨
• JavaScript 엔진이 내부적으로 변수 선언을 scope의 상단으로 끌어올림(hoist)

**LEXICAL SCOPE VS. DYNAMIC SCOPE

• scope : 코드를 작성할 때(lexical) 결정됨
• this (execution context): 함수가 실행될 때 (run-time, dynamically) 결정됨

---

---

매개변수 (Parameters)

• 전달인자 (argument)의 길이가 유동적이면, Rest Parameter(...)를 이용해 매개변수를 지정, 매개변수가 배열의 형태로 전달된다. 보통 optional한 parameter를 대괄호로 표시.

Math.max ([값1[, 값2[, ...]])

function getMaxNum(...nums) {
 return nums.reduce(function(acc, current) {
   if(acc > current) {
     return acc;
   } else {
     return current'
}
 });
}

getMaxNum (3,5,8,10); // 10

• arguments라는 키워드를 이용할 수도 있다.

function getMaxNum() {
  console.log(arguemtns); // {0:3, 1:5, 2:8, 3:10} 이 arguments 객체는 유사배열. 배열이 아님
  getMaxNum(3,5,8,10);
 // arguments[0]; -> 3
 // arguments[1]; -> 5
 // arguments[2]; ->8
 // arguments.forEach -> undefined

• 매개변수에 기본값을 넣어주고 싶으면 Default Parameter를 할당해줄 수 있다.
  문자열/ 숫자/ 객체 등 어떠한 타임도 가능

function getRoute(destination, departure = 'ICN') {
  return '출발지: ' + departure + ',' + '도착지: ' + destination;
}

getRoute('PEK'); // '출발지: ICN, 도착지: PEK'