오늘 수업은 node.js 마지막 수업..!
나의 혼공JS 셀프 스터디 시간도 마지막이구나~~ 노드 수업 놓친 순간부터 멍때리고 화면 보고 있을 바에 내 공부해야지~ 라는 마음으로 수업을 제꼈다.ㅋㅋㅋㅋ
(물론 나 말고도 많은 수강생이 그랬고, 강사님도 그걸 알고 계셔서 조금 안심이 되었다ㅋㅋㅋ)
오늘은 5단원(함수)와 6단원(객체)에 대해서 공부하였다.
★ [혼공JS] 5단원 - 함수
-
함수 : 코드의 집합
-
함수를 사용하면 좋은 점
- 반복 작업을 피할 수 있음
- 코드의 가독성이 좋아짐
- 기능별로 수정이 가능하고, 유지보수가 쉬움
-
익명 함수 : 이름이 없는 함수
function ( ) { }
- 순차적인 코드 실행에서 코드가 해당 줄을 읽을 때 생성됨
- 안전하기 때문에 익명 함수를 선언적 함수보다 선호함
-
선언적 함수 : 이름이 있는 함수
function 함수 이름 ( ) { }
- 순차적인 코드 실행이 일어나기 전에 생성됨
- 우리가 코드를 읽는 순서와 다른 순서로 함수가 선언되며, 함수를 같은 이름으로 덮어씀
-
함수 호출 : 함수를 사용하는 것
-
매개변수 : 함수를 호출할 때 괄호 안에 넣는 변수
-
리턴값 : 함수를 호출해서 최종적으로 나오는 결과
모든 함수에 매개변수와 리턴값을 사용하는 것이 아니라 필요한 경우에만 매개변수와 리턴값을 사용함
-
가변 매개변수 함수 : 호출할 때 매개변수의 개수가 고정적이지 않은 함수
-
나머지 매개변수
function 함수 이름(...나머지 매개변수) { }
-> 함수의 매개변수 앞에 마침표 3개(...)를 입력하면 매개변수들이 배열로 들어옴
- 전개 연산자 : 배열을 전개해서 함수의 매개변수로 전달해주며, 배열 앞에 마침표 3개(...)를 붙이는 형태로 사용함
함수 이름(...배열)
-> 전개 연산자를 사용하지 않은 경우에는 배열이 매개변수로 들어옴 // [Array(4)]
-> 전개 연산자를 사용한 경우에는 숫자가 하나하나 전개되어 매개변수로 들어옴 // [1, 2, 3, 4] - 기본 매개변수 : 매개변수에 기본값을 지정하고 싶을 때 사용하는 매개변수
함수 이름(매개변수, 매개변수=기본값, 매개변수=기본값)
★ 윤년인지 확인하는 함수
일반적으로 자바스크립트에서는 true 또는 false를 리턴하는 함수는 isOO이라는 이름으로 만드는 편임
기본 매개변수를 추가한 윤년 함수
★ a부터 b까지 더하는 함수
★ a부터 b까지 곱하는 함수
★ 최솟값을 구하는 함수
★ 최댓값을 구하는 함수
★ 콜백 함수를 활용하는 함수
1. forEach( ) 메소드
: 배열이 갖고 있는 함수(메소드)로써 단순하게 배열 내부의 요소를 사용해서 콜백 함수를 호출함
function (value, index, array) { }
- 예제 문제
2. map( ) 메소드
: 콜백함수에서 리턴한 값들을 기반으로 새로운 배열을 만드는 함수
3. filter( ) 메소드
: 콜백 함수에서 리턴한 값이 true인 것들만 모아서 새로운 배열을 만드는 함수
- 예제 문제
★ 화살표 함수
(매개변수) => 리턴값
- 메소드 체이닝 : 어떤 메소드가 리턴하는 값을 기반으로 해서 함수를 줄줄이 사용하는 것
★ 타이머 함수
- setTimeout(함수, 시간) : 특정 시간 후에 함수를 한번 호출함
- setInterval(함수, 시간) : 특정 시간마다 함수를 호출함
- clearTimeout(타이머_ID) : setTimeout( ) 함수로 설정한 타이머를 제거함
- clearInterval(타이머_ID) : setInterval( ) 함수로 설정한 타이머를 제거함
- 타이머 ID : setTimeout( ) 함수와 setInterval( ) 함수를 호출할 때 리턴값으로 나오는 숫자
★ 즉시 호출 함수
( function ( ) { } ) ( )
- 즉시 호출 함수를 사용하여 변수 이름 충돌 문제를 해결함
- 스코프 : 변수가 존재하는 범위
- 섀도잉 : 블록이 다른 경우 내부 변수가 외부 변수를 가리는 현상
-> 내부 블록에서는 내부 블록에서 선언한 변수만 볼 수 있음
★ [혼공JS] 6단원 - 객체
★ 객체
: '이름'과 '값'으로 구성된 속성을 가진 자바스크립트의 기본 데이터 타입
: 속성과 메소드를 가질 수 있는 모든 것
키 : 값
- 식별자로 사용할 수 없는 단어를 키로 사용할 때는 문자열을 사용함
- 식별자로 사용할 수 없는 키에 접근할 때는 대괄호를 사용함
-
객체는 중괄호{ }로 생성하며, 자료를 쉼표( , )로 연결함
제품명 : '망고 '
원산지 : '필리핀' -
객체 뒤에 대괄호[ ] 를 사용하고, 키를 입력하면 객체의 요소에 접근할 수 있음
product['제품명']
product['원산지'] -
온점 ( . ) 사용
product.제품명
product.원산지
- 배열 : 인덱스(index)와 요소(element)가 있음
- 요소(element) : 배열 내부에 있는 값
배열은 요소에 접근할 때 인덱스를 사용하지만, 객체는 키(key)를 사용함
- 속성(propertty) : 객체 내부에 있는 값
★ 메소드(method)
: 함수 자료형인 속성
- Array.isArray( ) : 배열인지 확인할 때
- indexOf( ) : 문자열 내부에 어떤 문자열이 있는지, 배열 내부에 어떤 자료가 있는지 확인할 때
- 있으면 해당 문자열이 시작하는 위치(인덱스)를 출력하고, 없으면 -1을 출력함
- toFixed( ) : 소수점 이하 몇 자리까지만 출력하고 싶을 때
- Number.isNaN( ) : 어떤 숫자가 NaN인지 확인할 때
- Number.inFinite( ) : 어떤 숫자가 Infinity(무한)인지 확인할 때
- trim( ) : 공백을 없앨 때
- split( ) : 문자열을 매개변수(다른 문자열)로 자라서 배열을 만들어 리턴할 때
- JSON.stringify( ) : 자바스크립트 객체를 JSON 문자열로 반환할 때
- JSON.parse( ) : JSON 문자열을 자바스크립트 객체로 전개할 때
- Math.random( ) : 랜덤한 숫자를 생성할 때
- 0이상 1미만의 랜덤한 숫자를 생성함
- sortBy( ) : 배열을 어떤 것으로 정렬할지 지정하면, 지정한 것을 기반으로 배열을 정렬해서 리턴함
★ this
-
this 키워드는 자기 자신이 가진 속성이라는 것을 표시할 때 사용함
-
this 바인딩 : this를 현재 객체와 연결하는 행위
- 익명함수 : this 바인딩을 함
- 화살표 함수 : this 바인딩을 하지 않음
★ 배열 전개 연산자
- 얕은 복사(참고 복사) : 복사하는 행위가 단순하고 다른 이름을 붙이는 형태로 동작하는 복사
- 깊은 복사 : 복사 후 두 객체를 완전하게 독립적으로 사용할 수 있는 복사
★ 긍정의 한줄
어디로 가고 있는가? 그곳에 도달하기 위해 오늘 무엇을 했는가? - 토마스 헨리 헉슬리 -
꾸준하게 ! 성실하게 !!
