반복문
= loop, iteration
- for문
for (초기식; 조건식; 증감식;) {
// if문의 조건이 true 일 때, 이후 실행문을 실행시키지 않고, 다음 조건식으로 for문을 수행
if(조건) continue;
실행문;
// if문의 조건이 true 일 때, for문을 종료
if(조건) break;
}
함수
// 함수선언
function greeting() {
console.log('안녕');
}
// 함수호출
greeting(); // 소괄호와 함께 호출 필수
===
// 함수
function getArea(width, height) { // 매개변수
let area = width * height;
// console.log(area)
return area; // 반환값
}
let area1 = getArea(10, 20); // 인수, area1 = 200
// 중첩함수
function hello() {
function bye() {
console.log('잘가');
}
console.log('안녕');
bye();
}
hello();
// result
// 안녕
// 잘가
자바스크립트의 호이스팅
= 끌어올리다.
함수의 선언이 호출 시점보다 아래있더라도 호이스팅으로 인해, 정상적으로 코드가 동작
hello();
function hello() {
console.log('안녕');
}
함수 표현식과 화살표 함수
// 함수 선언식 - 호이스팅O
function funcA() {
console.log('a');
}
let varA = funcA;
varA(); // result - a
// 함수 표현식 - 호이스팅X
// varB 1.
let varB = function funcB() { // 익명함수로 대체 가능
console.log('b');
}
// varcB 2.
let varB = function () {
console.log('b');
}
varB(); // result - b
funcB(); // 호출 불가, funcB는 값으로써 생성이 된 것이기 때문에
// 화살표 함수
// varC 1.
let varC = (value) => {
console.log(value);
return value + 1;
}
// varC 2.
let varC = () => 1;
console.log(varC()); // result - 1
***콜백함수
자신이 아닌 다른 함수에, 인수로써 전달된 함수를 의미한다.
function main(value) {
value();
}
function sub {
console.log('sub');
}
main(sub); // result - sub위의 예제와 같이, sub 함수를 main 함수의 인수로 전달해서 main 함수에서 호출시킬 수 있도록 하는 것.
콜백함수(sub함수)는 main함수에서 원하는 시점에 호출을 할 수 있다.
한마디로,
1. 인수로 사용되는 함수
2. 매개변수로 들어오는 함수
쯤 되려나??
// 콜백함수의 활용
function repeat(count) {
for (let idx === 1; idx <= count; idx++) {
console.log(ldx);
}
}
function repeatDouble(count) {
for (let idx === 1; idx <= count; idx++) {
console.log(ldx * 2);
}
}
repeact(5);
repeatDouble(5);
// 위와 같은 비슷한 중복코드를 개선할 수 있다.
function repeat(count, callback) {
for (let idx === 1; idx <= count; idx++) {
callback(ldx);
}
}
repeact(5, (idx) => console.log(idx * 2));
스코프
scope "범위"
변수나 함수에 접근하거나 호출할 수 있는 범위를 뜻 함
// 전역(전체 영역) 스코프 : 전체 영역에서 접근 가능
let a = 1;
// 지역(특정 영역) 스코프 : 특정 영역에서만 접근 가능
function funcA() = {
let b = 2;
console.log(a) // result - 1
}
console.log(b) // error - 'b is not defined'중괄호{} 안에 선언된 변수나 함수들은 모두 그 중괄호의 범위에 해당하는 지역스코프를 가지게 된다.
예외로, 함수 선언식은 함수 블록 내부에서만 지역스코프를 가진다.
객체
object
원시 타입이 아닌 객체 타입의 자료형
여러가지 값을 동시에 저장할 수 있는 자료형
// 객체 생성
let obj1 = new Object(); // 객체 생성자
let obj2 = {}; // 객체 리터럴
// 객체 프로퍼티 (객체 속성)
let person = {
age : 20, // property는 key : value로 구성
}
// 객체 프로퍼티를 다루는 방법
// 1. 점 표기법, 괄호 표기법
let age = person.age;
let age = person['age'];
// 괄화 표기법은 동적인 key값으로 value값을 구해와야할 때 유용
let property = 'hobby';
let hobby = person['hobby'];
// 2. 새로운 프로퍼티를 추가하는 방법
person.job = 'fe developer'; // 점 표기법 이용
person['favoriteFood'] = '떡볶이'; // 괄호 표기법 이용
// 3. 프로퍼티를 수정하는 방법
person.job = 'student'; // 점 표기법 이용
person['favoriteFood'] = '햄버거'; // 괄호 표기법 이용
// 4. 프로퍼티를 삭제하는 방법
delete person.job;
delete person['age']'
// 5. 프로퍼티의 존재 유무 확인 (in 연산자)
let result1 = "name" in person; // true or false 를 반환 (존재의 유무)
// 상수 객체
const animal = {
type: '강아지',
name: '시루',
color: 'white',
};
animal = { a: 1 }; // 오류 발생, animal은 const로 선언된 상수 객체이기 때문,
// 프로퍼티에 대한 조작은 가능하다.
animal.color = 'ivory'; // 수정
animal.age = 5; // 추가
delete animal.type; // 삭제
// 메서드 : 값이 함수인 프로퍼티
const person = {
name: '김형준',
say: () => console.log('hi');
};
person.say(); // result - hi배열
array
여러개의 값을 순차적으로 담을 수 있는 자료형
// 배열 생성
let arrA = new Array(); // 배열 생성자
let arrB = []; // 배열 리터럴
let arrC = [1, 2, 3, '안녕', '잘가'];
// 배열 요소 접근 - index로 접근
let item1 = arrC[0]; // result - 1
// 요소 수정
arrC[0] = 100;