var과 let,const의 차이점
let,const : 블록 스코프를 사용 - 블록 스코프란 {}내부에서 선언된 변수는 중괄호 외부에서는 접근할 수 없는 스코프를 말한다.
var : 함수 스코프사용 - 함수 내에서 선언된 변수는 함수 외부에서도 접근 가능 또한 var변수는 초기화하지 않으면 값이 할당되자 않은 상태로 남는다.
예상시험문제
var는 선언 전에 사용해도 오류가 발생하지 않습니다. 이를 호이스팅(hoisting)이라고 하며, 변수가 함수나 전역 스코프의 맨 위로 끌어올려지는 것입니다. 반면, let과 const는 호이스팅이 발생하지 않으므로 변수를 선언한 후에 사용해야 합니다.
배열 생성
let 이름 = [자료,자료,자료,자료]
let 이름 = new Array();
const arr = [
{ name: 'Alice', age: 20 },
{ name: 'Bob', age: 25 },
{ name: 'Charlie', age: 15 }
];
이런식으로 배열을 생성이 가능하기도 하다.
Push 배열 끝네 하나 이상의 요소를 추가합니다.
const arr = [1, 2, 3];
arr.push(4, 5);
console.log(arr); // [1, 2, 3, 4, 5]
Pop() 배열 끝에서 요소를 제거하고 그 값을 반환합니다.
const arr = [1, 2, 3];
const popped = arr.pop();
console.log(popped); // 3
console.log(arr); // [1, 2]
reverse() 배열을 뒤집습니다.
const arr = [1, 2, 3, 4, 5];
const reversedArr = arr.slice().reverse();
console.log(reversedArr); // [5, 4, 3, 2, 1]
sort() 배열의 요소들을 정렬합니다.
const fruits = ['banana', 'orange', 'apple', 'mango'];
fruits.sort(); // 결과: ['apple', 'banana', 'mango', 'orange']
문자열정렬
let array1 = [100, 21, 13, 40, 200];
let array2 = [11, 41, 24, 33];
array1.sort();
array2.sort();
숫자정렬: 기본 정렬 순서는 문자열 유니코드 포인트를 따른다.
오름차순 정렬을 하기위해서는 아래와 같은 코드를 작성한다.
arr.sort((a, b) => a.age - b.age);
console.log(arr); // [{ name: 'Charlie', age: 15 }, { name: 'Alice', age: 20 }, { name: 'Bob', age: 25 }]
splice() 배열 요소의 지정한 부분을 삭제하고 삭제한 요소를 리턴합니다.
const arr = [1, 2, 3, 4, 5];
const spliced = arr.splice(1, 2, 'a', 'b', 'c');
console.log(spliced); // [2, 3]
console.log(arr); // [1, 'a', 'b', 'c', 4, 5]
concat() 배열을 결합하여 새로운 배열을 반환합니다.
const arr1 = [1, 2];
const arr2 = [3, 4];
const arr3 = [5, 6];
const concatArr = arr1.concat(arr2, arr3);
console.log(concatArr); // [1, 2, 3, 4, 5, 6]
join() 배열 안의 모든 요소를 모두 합쳐 배열을 만들어 리턴합니다.
const arr = ["apple", "banana", "orange"];
const result = arr.join(); // "apple,banana,orange"
slice() 배열 요소의 지정한 부분을 리턴합니다.
const arr = [1, 2, 3, 4, 5];
const sliced = arr.slice(2, 4);
console.log(sliced); // [3, 4]
console.log(arr); // [1, 2, 3, 4, 5]
파괴적 비파괴적 / 변경, 변경x
비 파괴적 메소드 : concat
파괴적 메소드 : 그외
Array 객체 - 콜백 함수와 함께 사용하는 메소드
콜백 함수는 다른 함수의 인자로 넘겨지는 함수로, 해당 함수가 실행 완료되면 인자로 넘겨진 함수를 다시 호출하는 것입니다.
forEach() : 배열의 요소를 하나씩 뽑아 반복을 돌린다.
<script>
let array = [52, 273, 32, 64, 72];
array.forEach((item, index) => {
console.log(index + '번째 요소는 ' + item + '입니다.');
});
</script>
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const result = [];
arr1.forEach((num, index) => {
result[index] = num * arr2[index];
});
console.log(result); // [4, 10, 18]
map() : 콜백 함수에서 리턴하는 것을 기반으로 새로운 배열을 만듭니다.
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const result = [];
reslut = arr1.map((num, index) => {
result[index] = num * arr2[index];
});
filter() : 콜백 함수에서 true를 리턴하는 것으로만 새로운 배열을 만들어 리턴합니다.
const arr1 = [31, 22, 43];
const arr2 = [4, 5, 6];
const result = [];
result = arr1.filter((num, index) => {
return num >= 30
});
console.log(result); // [4, 10, 18]
오류
const arr1 = [31, 22, 43];
let result = arr1.filter((num, index) => {
return num >= 30
});
결과 [31, 43]
반복문
for in 반복문
for of 반복문
for(let 인덱스 in 배열){
}
let array=["사과","배","바나나",34,67,true,false];
for(let i in array){
console.log(array[i]);
}
let array=["사과","배","바나나",34,67,true,false];
for(let i=0; i<array.length; i++){
console.log(array[i]);
}
let array = ["사과", "배", "바나나", 34, 67, true, false];
for (let i of array) {
console.log(i);
}
위 3개의 반복문의 결과는 위의 결과로 동일하다.
변수의 스코프
변수를 사용할 수 있는 범위
블록
변수는 선언한 위치에 따라 사용 범위가 제한됨
블록 == 스코프
블록 내부에 선언된 변수는 해당 블록 내부에서만 사용 가능
function foo() {
var localVar = "I am local";
console.log(globalVar); // "I am global"
console.log(localVar); // "I am local"
}
console.log(globalVar); // "I am global"
console.log(localVar); // Uncaught ReferenceError: localVar is not defined
// 위와 같이 함수 내에서 선언한 변수는 해당 함수 안에서만 유효하며, 전역에서 선언한 변수는 모든 곳에서 접근 가능합니다.
console.log(foo); // undefined
var foo = "I am foo";
console.log(foo); // "I am foo"
// 위와 같이 변수와 함수의 선언을 코드 최상단으로 끌어올리는 호이스팅이 일어납니다.
호이스팅
해당 블록에서 사용할 변수를 미리 확인해서 정리하는 작업
var 변수의 스코프의 차이가 있다.
var키워드로 선언한 변수는 블록에 제한되지 않는다.