코테 풀면서 메모
제곱과 관련된 Math.sqrt & Math.pow 문법
<script>
const n = 121;
let num = Math.sqrt(n); // n의 루트 값을 반환
console.log(n, num); // 121 11
</script><script>
const num = 11;
let n = Math.pow(num, 3); // num의 3제곱
console.log(n, num); // 121 1331
</script>숫자의 자리수들로 배열을 만드는 방법
<script>
const n = 714; // 예시, n이라는 숫자가 주어진 상황
const arr = [...String(n)];
// [...문자열] : 스프레드 연산자. 문자열의 글자들을 배열로 만들어주는 간단한 방법.
// String(숫자) : 숫자를 문자열로 반환
// 백틱 안에 넣는 방법도 있다. 이게 간단해서 자주 사용할 수도 있겠다.
const arr2= [...`${n}`];
</script>응용해서 코테 문제풀이
- 함수 solution은 정수 n을 매개변수로 입력받습니다. n의 각 자릿수를 큰것부터 작은 순으로 정렬한 새로운 정수를 리턴해주세요. 예를들어 n이 118372면 873211을 리턴하면 됩니다.
<script>
function solution(n) {
let answer = "";
const arr = [...`${n}`]; // 숫자 자리수들을 배열로 변환
arr.sort((a, b) => b - a); // sort 메서드를 사용해서 내림차순 정렬.
// a와 b를 비교하면서 배열을 돈다.
// a - b : a가 b보다 크면 a를 b 뒤에 보냄. 오름차순 정렬.
// b - a : a가 b보다 크면 a를 b 뒤에 보냄. 내림차순 정렬.
answer = parseInt(arr.join(""));
return answer;
}
</script>React 입문 강의 노트
1. 객체와 배열
불변성 법칙
- 리액트에서는 state(변수)라는 것에 값을 저장할 때, 아래와 같은 방법을 사용하지 않는다.
<script>
const user = {
name: "김이름";
age: 25;
isAdmin: true;
};
user.email = "kimir000@gmail.com"; // 추가
user.age = 26; // 수정
delete user.isAdmin; // 삭제
</script>- 위 방법은 객체(배열) 자체를 변경해주지는 않는다. 객체 불변성이 깨진 상태다. 리액트에서는 객체 불변성을 유지하는 방법으로 작성한다. 중요한 부분!
객체 요소 접근 방법: Object.
1) Object.keys / Object.values
2) Object.entries
3) Object.assign
<script>
const user = {
name: "김이름";
age: 25;
isAdmin: true;
};
// (1-1)
const keys = Object.keys(user);
console.log(keys); // ["name", "age", "isAdmin"]
// (1-2)
const values = Object.values(user);
console.log(values); // ["김이름", 25, true]
// (2)
const entries = Object.entries(user);
console.log(entries); // [["name", "김이름"], ["age", 25], ["isAdmin", true]]
// 큰 배열 안에 [key, value]로 구성된 작은 배열들을 찢어 넣어준다.
// (3)
const userDetails = {
occupation: "개발자",
};
Object.assign(user, userDetails); // 원본 객체에다가 새로운 객체의 속성을 복사
// 원본 객체를 대상 객체, 추가하는 객체를 출처 객체라고 부른다.
console.log(user); // {name: "김이름", age: 25, isAdmin: true, occupation: "개발자"}
</script>배열: push & pop
<script>
const fruits = ["apple", "banana"];
// push 밀어넣기
fruits.push("orange");
console.log fruits // ["apple", "banana", "orange"]
// pop 마지막 요소 떼어오기
const lastFruit = fruits.pop();
console.log(lastFruit); // orange
console.log(fruits); // ["apple", "banana"];
</script>배열: map
<script>
// map: 원본 배열에서 각 요소를 가공한 새로운 배열을 리턴하는 함수
// 1) 배열 내의 모든 요소 각각에 대해
// 2) 주어진 함수를 호출한 결과를 모아
// 3) 새로운 배열을 반환
// 형태
const numbers = [1, 2, 3, 4, 5];
const squared = numbers.map(주어진함수(인자));
</script><script>
// 즉
const numbers = [1, 2, 3, 4, 5];
const squared = numbers.map(function(num) { // 주어진 함수
return num * num;
});
</script>배열: filters
<script>
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(주어진함수(인자));
</script><script>
// 즉
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(function(num) {
return num % 2 === 0;
});
</script>배열: reduce
배열의 각 요소에 대해서 주어진 함수를 실행하고, 결과물을 누적해 반환한다. reduce를 누적기라고 많이 부른다.
<script>
const numbers = [1, 2, 3, 4, 5];
numbers.reduce(주어진함수(인자1, 인자2)); // reduce는 인자가 두 개 들어간다.
</script>
배열: sort (기본적으로 유니코드 기반으로 정렬)
<script>
const fruits = ["banana", "orange", "apple"];
fruits.sort();
console.log(fruits); // ["apple", "banana", "orange"]
</script>- map이나 filter를 사용할 때는, 새로운 배열을 반환한다.
- 반면에 sort는 원본 배열 자체를 바꿔버린다. 불변성이 깨지는 것.
<script>
const fruits = ["banana", "orange", "apple"];
const sortedFruits = fruits.sort();
console.log(sortedFruits); // ["apple", "banana", "orange"]
console.log(fruits); // ["apple", "banana", "orange"]
</script>- 위와 같이! 새로운 배열에 할당하는 식의 코드를 작성하더라도 원본까지 변경된다.
sort 응용
<script>
const numbers = [40, 1, 100, 5, 25];
numbers.sort();
console.log(numbers); // [1, 100, 25, 40, 5]
// 기본적으로 유니코드 상으로 정렬하기 때문에, 숫자순으로 정렬하려면 로직을 추가해줘야 한다.
numbers.sort(function(a, b) {
return a - b; // 오름차 순으로 정렬해주는 비교함수!
});
console.log(numbers); // [1, 5, 25, 40, 100]
</script>