바닐라 자바스크립트를 이용해서 모멘텀을 만들어보았다. 시계, 사용자 이름 기억, 투두 리스트, 명언, 날씨 등의 기능을 넣었다. 그 중 투두리스트 구현 부분의 코드를 아래 가져와봤다. 전체 코드는 아래 깃허브에서 https://github.com/Seohyun-Roh/vanilla_JS GitHub - Seohyun-Roh/vanilla_JS: HTML, CSS, and JavaScript로 만든 Momentum입니다. HTML, CSS, and JavaScript로 만든 Momentum입니다. Contribute to Seohyun-Roh/vanilla_JS development by creating an account on GitHub. github.com index.html todo.js 전체 코드..

Array.prototype.filter() filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환 arr.filter(callback(element[, index[, array]])[, thisArg]) 매개변수 callback: 각 요소를 시험할 함수. true 반환 시 요소 유지, false 반환시 버림. 다음 세가지 매래변수를 받음. element: 처리할 현재 요소 index(Optional): 처리할 현재 요소의 인덱스 array(Optional): filter를 호출한 배열 thisArg(Optional): callback을 실행할 때 this로 사용하는 값. 반환 값 테스트를 통과한 요소로 이루어진 새로운 배열. 어떤 요소도 테스트를 통과하지 못했으면..

태그는 어디에 위치해야 할까? 브라우저의 구성 요소 렌더링 엔진은 HTML, CSS를 파싱한 결과물로 페이지를 화면에 표시한다. (대표적인 렌더링 엔진으로는 사파리의 webkit, IE의 trident, 파이어폭스의 Gecko, 크롬, 오페라, edge의 Blink(webkit에서 파생)가 있다.) 자바스크립트는 자바스크립트 해석기에서 해석한다. 브라우저의 동작 방식 HTML을 읽기 시작 HTML을 파싱 DOM 트리 생성 Render 트리(DOM tree + CSS의 CSSOM 트리 결합)가 생성 Display에 표시 script를 html에 위치시키는 방법에는 script를 head 태그 안에 위치시키는 경우, body 태그의 맨 아래에 위치시키는 경우, async나 defer를 사용하는 경우가 있다...

선택 정렬(Selection Sort) 시간 복잡도 최선: O(n^2) 최악: O(n^2) 평균: O(n^2) 장점 실행 전에 자료의 이동 횟수를 알 수 있음 보조 메모리가 제한되는 경우 복잡한 알고리즘에 비해 성능적인 이점을 낼 수 있음 단점 보통의 경우 O(n^2)의 시간 복잡도로, 비효율적인 정렬 방식 배열 내에 동일한 값이 중복되어 있다면 상대적인 위치가 변경될 수 있음 - 코드 예시 function solution(arr) { let answer = arr; for (let i = 0; i = arr[j]) idx = j; } [arr..

수정 내용을 push 하려고 했더니 아래와 같은 오류가 나왔다.. ! [rejected] main -> main (non-fast-forward) error: failed to push some refs to 'https://github.com/Seohyun-Roh/js_codingTest.git' hint: Updates were rejected because the tip of your current branch is behind hint: its remote counterpart. Integrate the remote changes (e.g. hint: 'git pull ...') before pushing again. hint: See the 'Note about fast-forwards' in ..

노마드 코더 수업을 듣다가 크로미움(크로미엄, 크로뮴 등으로도 부른다.) 브라우저라는 단어가 나왔다. 크롬과 무슨 차이가 있는지 궁금해져서 찾아보게 되었다. Chromium Browser 크로미움 브라우저는 구글에서 개발하는 오픈 소스 웹 브라우저 및 리눅스 계열 운영체제 프로젝트이다. 프로젝트의 산물로 나온 크로미움의 소스 코드는 다양한 브라우저들의 기반 엔진이 된다. 아래의 브라우저들이 크로미움을 기반으로 제작되었다고 한다. 주로 최신 기술을 시험하는 가늠터의 역할을 하며, 윈도우, macOS, 리눅스를 지원한다. 구글 크롬 브레이브 오페라 마이크로소프트 엣지 삼성 인터넷 네이버 웨일 비발디 Electron도 Chromium과 Node.js로 만들어졌다고 한다! 크로미움과 크롬 위키에 나와있는 내용을..

배열의 각 인덱스에 1~10까지의 값을 초기화해준다고 했을 때 보통은 아래와 같은 방법을 생각했었다. let arr1=[]; for(let i=1;i x + x); // [2, 4, 6] //v는 할당할 value, i는 인덱스 Array.from({length: 5}, (v, i) => i); // [0, 1, 2, 3, 4] Array.from({length: 5}, (v, i) => i+1); // [1, 2, 3, 4, 5] Array.from을 이용하여 빈 배열을 초기화 하는 코드 Array.from( {length: 20}, //배열 () => Array(10).fill(0) //각 배열에 적용할 함수 ); // 0으로 초기화된 20*10 짜리 2차원 배열을 리턴

기본적인 자료구조인 스택, 큐에 대해서 JS로 정리해보려 한다. push() push() 메서드는 배열의 끝에 하나 이상의 요소를 추가하고, 배열의 새로운 길이를 반환한다. arr.push(element1[, ...[, elementN]]) elementN: 배열의 끝에 추가할 요소. const animals = ['pigs', 'goats', 'sheep']; const count=animals.push('cows'); console.log(count); // expected output: 4 console.log(animals); // expected output: Array ["pigs", "goats", "sheep", "cows"] animals.push('cats', 'dogs'); conso..

JS의 splice() 메서드에 대해서 정리해보려 한다. Array.prototype.splice() splice() 메서드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가해서 배열의 내용을 변경한다. array.splice(start[, deleteCount[, item1[, item2[, ...]]]]) start: 배열의 변경을 시작할 인덱스. - 배열의 길이보다 큰 값이라면 실제 시작 인덱스는 배열의 길이로 설정된다. 음수인 경우 배열의 끝에서부터 요소를 세어나간다. 값의 절대값이 배열의 길이보다 큰 경우 0으로 설정된다. deleteCount (Optional): 배열에서 제거할 요소의 수. - deleteCount를 생략하거나 값이 array.length - start 보다 크면 s..

해쉬 알고리즘이란? 해쉬는 임의의 크기를 가진 데이터를 고정된 데이터의 크기로 변환시키는 것을 말한다. 이를 이용해 특정한 배열의 인덱스나 위치를 입력하고자 하는 데이터의 값을 이용해 저장하거나 찾을 수 있다. 기존의 자료 구조들을 탐색이나 삽입을 할 때 선형시간이 걸리기도 했던 것에 비해 해쉬를 이용하면 즉시 저장하거나 찾고자 하는 위치를 참조할 수 있으므로 더 빠른 속도로 처리할 수 있다. 1. 직접 주소 테이블(Direct Addressing Table) Direct Addressing Table은 key-value 쌍의 데이터를 배열에 저장할 때 key값을 직접적으로 배열의 인덱스로 사용하는 방법이다. 예를 들어 키 값이 400인 데이터가 있다면 이는 배열의 인덱스가 400인 위치에 키 값을 저장..