[부스트코스] 웹 프로그래밍 DB 연결 웹 앱 : JavaScript - FE

1) 자바스크릡트 변수- 연산자- 타입

변수

• var, let, const로 선언
• 어떤 것을 사용하는가에 의해 변수의 유효범위가 달라짐

var a = 2;
var a = "aaa";
var a = 'aaa';
var a = true;
var a = [];
var a = {};
var a = undefined;

 

연산자

• 우선순위는 ()를 사용
• 수학연산자 : +, -, *, /, % 등이 있음
• 논리 연산자, 관계 연산자, 삼항 연산자도 있음

//or 연산자 활용
const name = "crong";
const result = name || "codesquad";
console.log(result);
var name = "";
var result = name || "codesquad";
console.log(result);

 

연산자 - 삼항 연산자

• 간단한 비교와 값 할당은 삼항연산자 이용 가능

const data = 11;
const result = (data > 10) ? "ok" : "fail";
console.log(result);

 

연산자 - 비교 연산자

• 비교는 == 보다는 === 사용

0 == false;
"" == false;
null == false;
0 == "0";
null==undefined;

 

자바스크립트의 Type

• 타입은 선언 할 때가 아닌 실행타임에 결정 됨
• 함수 안에서의 파라미터나 변수는 실행 될 때 그 타입이 결정 됨
• 타입을 체크하는 또렷한 방법은 없음
• 정확하게는 toString.call 함수를 이용해 결과를 매칭하는데 문자와 숫자와 같은 자바스크립트 기본 타입은 'typeof' 키워드를 사용해서 체크 함
• 배열은 타입을 체크하는 isArray함수가 표준으로 생김

 

2) 자바스크립트 비교-반복-문자열

비교문

• if, else if, else 를 통해서 다양한 비교문을 사용할 수 있음

분기 - switch

• 로직을 분기하기 위해서는 if문 외에도 switch가 있음

반복

• for문 이나 while 문을 사용해서 반복문을 구현 가능
• 배열의 경우 forEach와 같은 메소드도 있고, for-of를 통한 탐색도 자주 사용함 (for-in은 객체 탐색할 때 사용)

function howMany(selectObject) {
  var numberSelected = 0;
  for (var i = 0; i < selectObject.options.length; i++) {
    if (selectObject.options[i].selected) {
      numberSelected++;
    }
  }
  return numberSelected;
}

 

문자열 처리

• 자바스크립트의 문자와 문자열은 같은 타입으로 모두 문자열임

typeof "abc";  //string
typeof "a";    //string
typeof 'a';    //string. single quote도 사용가능.

 

3) 자바스크립트 함수

함수 - 함수의 선언

• 함수는 여러개의 인자를 받아 그결과를 출력

• 파라미터의 개수와 인자의 개수가 일치하지 않아도 오류가 나지 않음

함수 - 함수표현식

• printName과 같이 표현할 수 있음

• 함수선언문과 달리 선언과 호출순서에 따라 정상적으로 함수가 실행되지 않을 수 있음
  

함수 - 표현식과 호이스팅

• hoisting : 함수 안에 있는 변수들을 모두 뜰어올려서 선언하는 것

함수 - 반환값과 undefined

• 자바스크립트 함수는 반드시 return 값이 존재하며, 없을 때는 기본 반환 값인 'undefined'가 반환됨

• void 타입이 없음

함수 - arguments 객체

• 함수가 실행되면 그 안에 arguments라는 특별한 지역변수가 자동으로 생성

• argument의 타입은 객체, 배열 타입이 아님 (배열 메소드 못 씀)
• 자바스크립트의 가변인자를 받아 처리하는 함수를 만들 때 arguments 속성을 유용하게 사용할 수 있음

 

4) 자바스크립트 함수 호출 스택

함수 호출

// 함수의 호출.
function printName(firstname) {
    var myname = "jisu";
    return myname + " ," +  firstname;
}

function run(firstname) {
   firstname = firstname || "Youn";
   var result = printName(firstname);
   console.log(result);
}

• run이 호출되고 그 다음에 printName이 호출 됨

 

<해당 포스트는 교육 목적을 위해 '부스트코스'의 강의를 듣고 강의자료를 개인적으로 정리한 것으로 모든 내용의 출처와 저작권은 부스트코스에 있습니다.>