배운 점
vscode 디버깅
아무생각 없이 f5 엔터를 해서 node.js가 실행되어야 하는데 크롬이 실행되게 되었다.
어떻게 수정해야 하나 고민하다가
launch.json 파일의 configurations가 chrome, 추가적으로 시도한 것들이 나열되어 있어서 지워주고 저장하니까 디버깅을 어떻게 할지 고르는 창이 다시 잘 나왔다.
vscode 단축키
- end
항상 세미콜론 붙일때 이동하기 불편했는데 end 키를 사용하면 맨 끝으로 이동할 수 있었다.
JS강의
1. 문자열화 하는 법
JSON.stringify(객체)
2. spread operater
ES6에 나온 문법
3. JS에서의 비교연산자
3 < i < 100js에서는 이렇게 사용하면 (3 < i)로 인식한다.
4. 1주차 숙제
프로그래머스 코딩 테스트 2문제
1) 문자열 s = "asdf"가 있으면 s[0] 으로 접근이 가능하다.(a출력)
숙제 코딩 테스트를 푸는데 각 문자열을 배열에 넣고 사용하려 했는데 이게 작동되는게 신기했다.
한번에 처리할 수 있도록 대문자로 변환해준 뒤, cnt를 이용해서 0이 되면 갯수가 같으니까 true를 반환하게 코딩하였다.
1번 답안
function solution(s) {
s = s.toUpperCase(); // 대문자로 변환
cnt = 0
for(let i = 0; i < s.length;i++) {
if(s[i] === 'P') cnt++;
if(s[i] === 'Y') cnt--;
}
if (cnt === 0){
return true;
} else{
return false;
}
}2) 입력받은 signs가 true이면 더하고 false이면 빼주도록 코드를 작성해주었다.
마지막의 console.log는 테스트 해보느라 빼고 제출하면 정답이라고 나왔다.
2번 답안
function solution(absolutes, signs) {
let result = 0
for (let i = 0; i < signs.length; i++){
if (signs[i] === true){
result += absolutes[i];
}
else{
result -= absolutes[i];
}
}
return result
}
console.log(solution([4,7,12],[true,false,true]));6. 템플릿 리터럴의 활용 (백틱 ``)
변수를 따로 처리하고 싶을 때 사용하는 건 알았는데 띄어쓰기까지 적용되는지는 처음 알았다.
예전에 미니 프로젝트에서 append를 사용하여 html코드를 붙여 넣었었는데, 다음에는 띄어쓰기를 주의해야겠다.
7. 콜백함수
const person = {
name: "Jhon",
age: 31,
isMarried: true,
// sayHello: function() {
// console.log(`hello, My name is ${this.name}`);
// },
sayHello: () => {console.log(`hello, My name is ${this.name}`);}
,
}
person.sayHello(); // hello, My name is jhon주석처리한 코드는 이름이 제대로 출력되는데 화살표 함수를 사용하면 undefined가 출력된다.
왜 그렇게 되는지 힌트로 화살표함수는 this를 바인딩 하지 않는다고 하셨는데, 좀 더 찾아보았다.
=> JS는 급하게 만든 언어라 오류가 많은 것으로 알고 있는데 (type 등등)
- this 바인딩
상황에 따라 다르게 바인딩 된다.
- 전역 공간의 this : 전역객체
- 메소드 호출 시 메소드 내부의 this: 해당 메소드를 호출한 객체
- 함수 호출 시 함수 내부의 this: 지정되지 않는다.
화살표 함수로 선언한 함수에는 this가 없다.
3주차에 설명한다고 하니 일단 이정도로 알고 넘어가자.
8. Map 기본 사용법
- 선언
const 변수이름 = new Map();- 요소 추가
변수이름.set(key, value);- 요소 가져오기
변수이름.get(key);
변수이름.has(key); // 검색, T/F 반환 9. Map 반복문
map의 메서드 keys(), values(), entries()를 사용해서 출력해보면 MapIterator와 함께 메서드에 따라 값이 출력된다.
10. 2주차 숙제
function solution(strings, n) {
return strings.sort((a,b) => { // 정렬 기준 인자로 받음
if(a[n]> b[n]) return 1; // 1일 경우 순서를 바꿈
else if (a[n] < b[n]) return -1;
else return a > b ? 1 : -1; // 같은 문자일 경우 사전순으로 정렬
})
}
sort가 매개변수를 비교해서 n번째 문자를 비교해서 오름차순으로 정렬할 수 있도록 반환값을 설정해주었다.
궁금한 내용/부족한 내용
for of 문이 나오는데 평소에 for in문을 많이 사용했어서 차이점이 궁금하여 찾아보았다.
- for of 와 for in
js에서는 for in도 많이 사용하는데 for of를 사용한 이유가 궁금하여 찾아보았다.
for of: ES6에 추가된 문법이며, 새로운 컬렉션 전용(Symbol.iterator 속성)이다.
for in: 객체의 모든 열거 가능한 속성에 사용이 가능하다.
map을 출력해보면 mapiterator가 나오는데 이를 통해 사용 가능하다는 점을 알 수 있는 것 같다.
다른분들의 알고리즘 풀이를 보면 배웠던 것을 활용해보거나 다르게 푸시던데, 본인은 활용부분에서 부족하다고 느껴졌다.
느낀점
1,2주차 강의는 다른 강의를 많이 들었어서 코드를 쳐보면서 연습만 하고 빠르게 넘겼다. 하지만, 코딩 테스트를 통해 사고력이나 실전에서 활용이 어떻게 될지 기대되고 클론 코딩을 시간이 남으면 해봐야겠다. 현재 알고리즘과 정처기, 운동만 해도 평일에는 시간이 남아나지 않는데 주말을 활용해야겠다.
