TIL #11 - JavaScript

rosarang·2021년 1월 13일
0

JavaScript

목록 보기
2/6
post-thumbnail

console.log

console.log() - 개발자가 확인하고 싶은 내용을 출력. 개발자 도구에서만 확인 가능

alert나 console.log 처럼 이미 정의된 함수는 약속어이므로 같은 이름의 함수 만들면 안된다.

JavaScript 주석 방법

// - 한 줄용

/* ... */ - 두 줄 이상

주석을 사용하는 이유

  • 필요 없어진 코드를 혹시 몰라 남겨놓을 때
  • 인수인계
  • 코드를 볼 때마다 이해되지 않아 한글로 설명할 경우

변수

var 변수이름 = 값;

변수 이름 주의사항

  • 한 파일에서 같은 이름 중복 사용 x
  • 대소문자 구분
  • 첫 번째 문자는 반드시 글자나 밑줄, 달러기호 중 하나
  • 두 번째 문자부터 글자, 밑줄, 달러, 숫자 중 자유롭게 사용 가능
  • 변수 이름, 함수 이름 등 camelCase 방식으로 사용
    (변수 이름은 snake_case보다 camelCase를 사용함)

변수명의 중요성

  • 코드의 가독성
  • 커뮤니케이션 리소스를 줄일 수 있어 개발 효율 향상

ES6 버전 변수 키워드 var에 이어 let, const 추가

  • 'let' - 변수 값 수정 가능
  • const - 변수 값 수정 불가능
let name = "철수";
name = "영희"; // 가능

변수 값 수정 시 let과 같은 키워드 앞에 붙이지 않음. 변수를 생성할 때만 붙임
변수 값은 중복 얼마든지 가능

함수

특정 작업을 수행하도록 설계된 독립적인 블록

함수이름(); - 함수 호출

  • 함수 이름을 부르면 내에 있는 코드 실행
  • 함수를 정의하고 호출만 하면 실행되지 않음

형태

function 함수이름() {
  실행할 코드
/* ex) let ... ;
	return ... ; */
}

데이터 반환

모든 함수는 데이터를 변환함. 이 값을 변수에 저장하거나 다른 로직에 활용함

console.log() - 반환 값 확인 방법

매개변수(parameter)와 인자(argument)

매개변수가 없는 함수
console.log('=====파라미터가 없는 함수=====');
function noParameter() {
  return 10;
}

const result4 = noParameter();

console.log(result4);
매개변수가 있는 함수
console.log('=====파라미터를 받는 함수=====')

function getName(name) {
  return name + '님';
}

const result1 = getName('개발자');
const result2 = getName('디자이너');
const result3 = getName('기획자');

console.log(result1);
console.log(result2);
console.log(result3);

매개변수 = name
인자 = 개발자, 디자이너, 기획자

profile
UX에 관심 많은 개발 초보 Front-end Developer

0개의 댓글