홍장군의 기록

(프로그래머스 1Lv, 캐릭터의 좌표) 내 풀이) key input은 최대 50이므로 for 문을 쓴대도 시간적인 제한은 없다. for 문으로 key input 원소들을 하나씩 받아와, 좌표 처리를 하면 되는 문제이다. 단, 좌표를 옮길 때 board 바깥으로 벗어나지 않게끔 케이스 처리를 해야 한다. 좀 더 깔끔한 코드를 위해 증감 연산자를 썼으며, 값을 먼저 계산한 다음 그 값이 board를 벗어나는지 아닌지 체크해야 하므로 ++--value 형식으로 코드를 썼다. 내 코드) function solution(keyinput, board) { let edgeRow = Math.floor(board[0] / 2); let edgeCol = Math.floor(board[1] / 2); let xLoc =..

0. 문자열을 잘라보자. (참고로 문자열을 구분자 기준으로 잘라 배열로 만드는 메소드는 split 이다.) 자바스크립트에서 문자열을 자르기 위해 사용되는 메소드로는 크게 3가지가 있다. substr substring slice 세 메소드를 어떻게 쓰는 건지 잘 알아보자. 1. substr 메소드로 문자열 자르기. string = string.substr(start, length);substr 메소드는 파라미터가 2개이다. start 인자는 생략 불가능한 필수 파라미터이다. 시작 인덱스부터 시작해서 문자열을 자른다. length 인자는 생략 가능한 파라미터로, 생략하면 문자열 전체를 리턴, n을 쓰면 n 만큼 문자열을 자른다. let str = "hello javascript!"; str = str.sub..

0. split 메소드 JavaScrip에서는 문자열을 자를 때에 split 메소드를 활용한다. 이번 시간에 어떻게 split 메소드를 잘 활용할 수 있을지, 메소드를 잘 알아보자. 1. split 메소드 기본 동작 split 메소드는 String 형 자료형에 쓰는 메소드이다. 인자로 받은 값을 구분자로 받아, 문자열을 구분자 기준으로 자른 후 배열에 저장하여 리턴해준다. let array = string.split(seperator, limit); 이 때 split 메소드의 인자는 두 개가 있는데, seperator: 구분자. seperator을 기준으로 문자열을 자름. 필수 값이 아니다!! limit: 최대 분할 갯수. 필수 값이 아니다!! EX 1. 파라미터를 아무 것도 입력하지 않을 경우. 문자열..

프로그래머스 1레벨 2021 카카오 채용 연계형 인턴십 문제. 내 풀이) replace 메소드를 사용하면 간단하게 풀 수 있다. 문자열 길이가 최대 50이기 때문에, while이나 for 문으로 영단어를 찾는다 해도 시간 초과가 나지 않는다. 주의할 점) replace나 replaceAll 메소드를 쓸 때엔 s = s.replace(..,) 처럼 재할당 해주는 식으로 써야 한다. replaceAll 메소드를 생각지 못해 replace 메소드를 활용해 코드를 짰었는데, replaceAll을 기억해두자. 문자열 숫자가 아닌 글자가 있는지 판별하려면 isNaN 함수를 쓰자. if (isNaN(str)) {...} 내 코드) const enToNum = ["zero", "one", "two", "three", ..

for in 문을 배열에서 쓰면 안되는 이유. 필자는 보통 배열의 인덱스를 가지고 활용할 때 for in문을 쓰지만, for in 은 정확히 말하자면 해당 객체의 '프로퍼티 속성' 을 가져온다. js에서는 배열의 인덱스를 자동으로 프로퍼티 네임이라 인식하기 때문에 for in을 배열에 활용하면 인덱스가 나오는 것이다. 근데 사실 for in을 배열에 활용하면 여러 문제가 생길 수 있다. 아래 코드를 보자. // 어떻게 출력될까? const arr = ["a","b","c","d"]; for (let i in arr){ console.log(i); } 배열의 인덱스 값을 출력하니 0 1 2 3 4가 출력될거라 예상하겠지만, 사실 이렇게 출력된다. (띠용...) 왜냐하면, for in문은 대상..

0. 오늘의 배울 것 js의 짜투리 문법들을 알아볼 것이다. 간단하게 구조분해와 try catch 문을 살펴보자. 1. 문장과 표현식 js 코드는 문장과 표현식으로 구성되어있다!! 어떤 게 문장이고 뭐가 표현식인지 이해하면, 나중에 문법을 확장해서 배울 떄 도움이 되니 알아두자. 문장: statements. 어떤 동작이 일어나도록 작성된 최소한의 코드 덩어리. let x; // 문장 1 x = 3; // 문장 2 표현식: expression. 1줄이든 여러 줄이든 결과적으로 하나의 값이 되는 모든 코드. const title = "JavaScript"; // 표현식 1 const codeit = { name: "Codeit", }; // 표현식 2. 문장은 표현식인 문장과 표현식이 아닌 문장으로 나뉘는데..

0. 오늘의 배울 것. 자바스크립트에서 함수를 정의내리고 사용하는 방법은 어마무시하게 다양하다!! js 자체에서 함수를 활용하는 방법도 다양하지만, 모던 자바스크립트로 새로운 함수 정의법이 추가되면서 정말 다양해졌다. 이를 잘 알고 적재적소에 사용하는 것이 중요하다!! 가끔 알고리즘 문제를 풀면서 다른 사람들의 풀이를 볼 때, 거기서 함수 정의한 방식 자체가 생소해서 코드를 이해 못했던 적이 있다. 이번 기회에 함수 정의법을 잘 공부해두고, 남의 코드를 해석하는 능력도 길러보자. 1. 함수 정의하는 방법. (1) 함수 선언식: function 키워드를 통해 일반 함수 정의하기. 가장 기본적으로 함수를 만드는 방식은, 함수 선언식을 활용하는 것이다. 아래 코드처럼 function 키워드 다음 함수 코드를 ..

0. 오늘의 배울 것. 모던 자바스크립트? ECMAScript란 js 프로그래밍 언어의 표준이다. js가 프로그래밍 언어로 정착하면서 ECMA international 이라는 국제 기구에서 js를 쓸 때의 규칙을 standard ECMA-262 라는 이름의 문서를 만들었는데, 이 문서의 내용이 ECMA script 이다. 그리고 모던 자바스크립트란 현 시점에서 여러 브라우저 내에서 사용할 수 있는 범위 내에서 최신 버전 표준을 준수하는 js를 말한다. 워낙 js가 많이 변화해온 언어다보니 ... ㅡㅡ;; 1. 새로 추가된 데이터 타입 JS의 데이터 타입 기본형: Number, String, Boolean,, Null, Undefined 와 더불어 새로 2020년에 추가된 Symbol, BigInt 타입...

0. 오늘의 배울 것 js의 꽃은 이벤트 다루기가 아닐까?! 웹 동작을 담당하는 js이니 이벤트 다루는 게 js의 꽃이지 않을까?! 하는 게 필자의 생각이다... 다양한 이벤트를 어떻게 받아 핸들링할지 알아보자. 1. 이벤트 핸들러 등록하기 이벤트를 받아 동작하는 함수를 이벤트 핸들러라고 했다. 이걸 어떻게 요소에 등록하는 걸까? DOM 태그에 접근해서 onclick 프로퍼티 활용하기. html 태그에 onclick 속성 활용하기. 근데 이렇게 태그에 직접 접근하는 건 잘 사용 안함. 아예 함수 덮어쓰기 때문에 함수 여러 개 등록하기 힘들다. 3. addEventListner 메소드 사용하기 > 제일 많이 쓰인다!! element.addEventListener(이벤트종류, 이벤트핸들러); btn.addE..