JavaScript 26

[엘리스 AI트랙] 211006 TIL

오늘은 7일인데 왜 6일자 TIL을 이제서야 올리냐면...흠흠 TIL은 오늘 하루 새롭게 알게 된 내용 위주로 작성하고 있어요 ✏️ 리액트 1. SPA(Single Page Application) (1) 전통적인 페이지 서버에 특정 동작(ex: 로그인)을 요청 - 서버에서 HTML을 클라이언트에게 전달하면서 페이지 리로드 (2) SPA 페이지 JSON 형식으로 메세지만 서버로부터 받은 뒤 로그인 후에 바뀌어야 할 부분만 바뀌게 됨(ex: 로그인 -> 로그아웃 버튼) 페이지의 변경이 필요할 때 처음부터 모든 HTML을 불러오는게 아닌 변경된 부분만 바뀌게 된다. 2. Virtual DOM 가상적인 표현을 메모리에 저장하고 ReactDOM과 같은 라이브러리에 의해 실제 DOM과 동기화하는 프로그래밍 개념 R..

[엘리스 AI트랙] 02-03-01 ~ 02-03-02 자바스크립트 2

WIL은 한 주간 새롭게 알게 된 내용 위주로 작성하고 있어요 ✏️ 1. DOM(Document Object Mode, 문서 객체 모델) 객체 지향 모델로써 구조화된 문서를 표현하는 방식 트리 구조 XML이나 HTML 문서의 프로그래밍 인터페이스 문서의 구조화된 표현을 제공하여 프로그래밍 언어가 문서 구조, 스타일, 내용 등을 변경할 수 있도록 함 종류: Core Dom(for 모든 문서 타입), HTML Dom, XML Dom (1) Document 객체 웹 페이지를 의미 웹 페이지에 존재하는 HTML 요소에 접근하고자 할 때는 반드시 Document 객체부터 시작해야함 (2) HTML 요소의 선택 - 새로운 HTML 요소 선택을 위해 제공되는 메서드 메서드 설명 document.getElementBy..

[엘리스 AI트랙] 02-02-03 자바스크립트 1

WIL은 한 주간 새롭게 알게 된 내용 위주로 작성하고 있어요 ✏️ 1. 자바스크립트의 데이터 타입 String 문자열 Number 숫자 Function 함수 Array 배열 Object 객체 Boolean 불린 undefined 정의되지 않음 null 널 1) 배열: 비슷한 성격을 갖고 있는 데이터를 하나의 변수 안에서 관리 2) 객체: 프로퍼티, 메서드, 데이터로 구성되어 있으며 여러 종류의 데이터 타입 삽입 가능 3) undefined은 값이 정의되지 않은 것, null은 임의로 빈 데이터를 삽입한 것 2. 자바스크립트의 프로퍼티와 메서드 사실 두 개의 개념이 좀 헷갈렸는데 쉽게 정리한 글을 발견👍 https://www.codeit.kr/community/threads/22083 코딩이 처음이라면,..

[프로그래머스] 숫자 문자열과 영단어 - Javascript

링크 https://programmers.co.kr/learn/courses/30/lessons/81301 코딩테스트 연습 - 숫자 문자열과 영단어 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자 programmers.co.kr 문제 설명 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자릿수를 영단어로 바꾸는 예시입니다. 1478 → "one4seveneight" 234567 → "23four5six7" 10203 → "1zerotwoze..

PS:0 2021.08.11

[프로그래머스] 부족한 금액 계산하기 - Javascript

링크 https://programmers.co.kr/learn/courses/30/lessons/82612 코딩테스트 연습 - 1주차 새로 생긴 놀이기구는 인기가 매우 많아 줄이 끊이질 않습니다. 이 놀이기구의 원래 이용료는 price원 인데, 놀이기구를 N 번 째 이용한다면 원래 이용료의 N배를 받기로 하였습니다. 즉, 처음 이 programmers.co.kr 문제 설명 새로 생긴 놀이기구는 인기가 매우 많아 줄이 끊이질 않습니다. 이 놀이기구의 원래 이용료는 price원 인데, 놀이기구를 N 번 째 이용한다면 원래 이용료의 N배를 받기로 하였습니다. 즉, 처음 이용료가 100이었다면 2번째에는 200, 3번째에는 300으로 요금이 인상됩니다. 놀이기구를 count번 타게 되면 현재 자신이 가지고 있는..

PS:0 2021.08.09

[프로그래머스] 124 나라의 숫자 - Javascript

링크 https://programmers.co.kr/learn/courses/30/lessons/12899 코딩테스트 연습 - 124 나라의 숫자 programmers.co.kr 문제 설명 124 나라가 있습니다. 124 나라에서는 10진법이 아닌 다음과 같은 자신들만의 규칙으로 수를 표현합니다. 124 나라에는 자연수만 존재합니다. 124 나라에는 모든 수를 표현할 때 1, 2, 4만 사용합니다. 예를 들어서 124 나라에서 사용하는 숫자는 다음과 같이 변환됩니다. 10진법 124 나라 10진법 124 나라 1 1 6 14 2 2 7 21 3 4 8 22 4 11 9 24 5 12 10 41 자연수 n이 매개변수로 주어질 때, n을 124 나라에서 사용하는 숫자로 바꾼 값을 return 하도록 solu..

PS:0 2021.08.02

[Javascript] Exec 함수 / Match 함수 / MatchAll 함수 알아보기

1. RegExp.prototype.exec 인수로 전달받은 문자열에 대해 정규식과 일치하는지 탐색을 수행한 한 결과를 배열(없다면 null)로 반환한다. 2. String.prototype.match 자신을 호출한 문자열과 인수로 전달받은 정규 표현식과의 매칭 결과를 배열(없다면 null)로 반환한다. 일단 exec()의 형식은 정규식.exec(문자열) / match()의 형식은 문자열.match(정규식) 로 순서가 반대이다. 그럼 순서에서 차이점만 있는건가...? 했는데 그건 또 아니었음 🤔 차이점 1) 정규식에 g 플래그를 붙여서 함수를 실행하면 match는 문자열에서 해당하는 부분을 전부 배열에 넣어서 return 해주지만 exec는 처음 일치하는 부분 하나만 배열에 넣어서 return한다. co..

FE/Javascript 2021.07.03

[Javascript] Filter 함수 알아보기

Array.prototype.filter 자신을 호출한 배열의 요소들에 대해 인수로 전달받은 함수를 호출한다, 그리고 그 결과가 true인 요소들을 모아서 새로운 배열을 반환한다 원본 배열은 변경 X 구문 arr.filter(callback(element[, index[, array]])[, thisArg]) 매개변수 1. callback: 각 요소를 검사할 함수 - return값이 true면 유지 / false면 버림(다음 세 가지 인수를 가진다) 1) element: 처리할 현재 요소 2) index(optional): 처리할 현재 요소의 인덱스 3) array(optional): filter()을 호출한 배열 2. thisArg(optional): callback을 실행할 때 this로 사용되는 값..

FE/Javascript 2021.06.25

[Javascript] Map 함수 알아보기

Array.prototype.map 자신을 호출한 배열의 요소들에 대해 인수로 전달받은 함수를 호출한다, 그리고 그 결과를 모아서 새로운 배열을 반환한다 원본 배열은 변경 X 구문 arr.map(callback(currentValue[, index[, array]])[, thisArg]) 매개변수 1. callback: 새로운 배열 요소를 생성하는 함수(다음 세 가지 인수를 가진다) 1) currentValue: 처리할 현재 요소 2) index(optional): 처리할 현재 요소의 인덱스 3) array(optional): map()을 호출한 배열 2. thisArg(optional): callback을 실행할 때 this로 사용되는 값 const vege = ["가지", "호박", "시금치"]; c..

FE/Javascript 2021.06.24

[프로그래머스] 로또의 최고 순위와 최저 순위 - Javascript

링크 programmers.co.kr/learn/courses/30/lessons/77484 코딩테스트 연습 - 로또의 최고 순위와 최저 순위 로또 6/45(이하 '로또'로 표기)는 1부터 45까지의 숫자 중 6개를 찍어서 맞히는 대표적인 복권입니다. 아래는 로또의 순위를 정하는 방식입니다. 1 순위 당첨 내용 1 6개 번호가 모두 일치 2 5개 번호 programmers.co.kr 문제 설명 로또 6/45(이하 '로또'로 표기)는 1부터 45까지의 숫자 중 6개를 찍어서 맞히는 대표적인 복권입니다. 아래는 로또의 순위를 정하는 방식입니다. 순위당첨 내용 1 6개 번호가 모두 일치 2 5개 번호가 일치 3 4개 번호가 일치 4 3개 번호가 일치 5 2개 번호가 일치 6(낙첨) 그 외 로또를 구매한 민우는..

PS:0 2021.05.07 (2)