728x90 자바스크립트8 [알고리즘 문제 풀이] 퀵 정렬, 정수를 요소로 갖는 배열을 입력받아 오름차순으로 정렬하여 리턴해야 합니다. 💡 퀵 정렬 (Quick Sort) - '찰스 앤터니 리처드 호어' 가 개발한 알고리즘. - 퀵 정렬은 불안정 저렬에 속하며, 다른 원소와 비교만으로 정렬을 수행하는 비교 정렬에 속한다. - 분할 정보 알고리즘의 하나로, 평균적으로 매우 빠른 속도를 자랑함. 방법 1) 리스트 안에 있는 한 요소를 서택한다. 이렇게 고른 원소의 크기를 피벗이라고 한다. 2) 피벗을 기준으로 피벗보다 작은 요소들은 왼쪽, 큰 요소들은 오른쪽에 옮긴다. 3) 부분 리스트들이 더이상 불가능할 때까지 반복한다. quickSort 문제 정수를 요소로 갖는 배열을 입력받아 오름차순으로 정렬하여 리턴해야 합니다. 입력 인자 1 : arr number 타입을 요소로 갖는 배열 arr[i]는 정수 arr.length는 100,000 이하.. 2022. 6. 14. [알고리즘] 문자열을 입력받아 문자열을 구성하는 각 단어의 첫 글자로 이루어진 문자열을 리턴해야 합니다. 💡 최대한 간결하게 풀어본 나의 풀이 function firstCharacter(str) { // TODO: 여기에 코드를 작성합니다. return str.split(" ").map((a) => a[0]).join("") } 💡 Split () : 문자열을 일정한 구분자로 잘라서 배열로 저장 const str = "Hello I am learning JavaScript!"; console.log(str.split(" ")); // [ 'Hello', 'I', 'am', 'learning', 'JavaScript!' ] 💡 join() : 배열의 모든 요소를 연결해 하나의 문자열로 만든다. const arr = ['A', 'B', 'C']; console.log(arr.join()); // A,B,C co.. 2022. 5. 11. <JavaScript> React 그리고 JSX 🌈 React 리액트는 프론트엔드 개발을 위한 JavaScript 오픈소스 라이브러리 - 선언형 (Declarative) 리액트는ㅇ 한 페이지를 보여주기 위해 HTML/CSS/JS 로 나눠서 적기 보다는 하나의 파일에 명시적으로 작성할 수 있게 JSX를 활용한 선언형 프로그래밍을 지향한다. 직관적으로 코드를 짤 수 있다는 장점이 있다. 코드를 보고 실제 기능을 대충 떠올릴 수 있다. - 컴포넌트 기반 (Component-Based) 하나의 기능 구현을 위해 여러 종류의 코드를 묶어둔 컴포넌트를 기반으로 개발한다. 컴포넌트로 분리하면 서로 독립적이고 재사용이 가능하기 때문에 기능 자체에 집중하여 개발할 수 있다. - 범용성 리액트는 자바스크립트 프로젝트 어디에든 유연하게 적용 가능. 페이스북에서 관리되어 .. 2022. 5. 6. [JavaScript] React 로 만든 웹페이지 실행하는 방법은? 🌈 React 실행하기 1. create-react-app 설치 npm install -g create-react-app 2. react project 생성 -> 원하는 이름으로 생성하면 된다. create-react-app test_app 3. 생성한 폴더로 이동 후 app을 실행시키면 아래와 같은 페이지가 생성된 것을 확인할 수 있다. cd test_app npm start 4. App.js 파일에 들어가 수정하고 save를 하면 자동으로 컴파일이 시작되어, 페이지가 자동으로 reload 되는 것도 확인할 수 있다. 이제 리액트 공부 준비 끄읕:D 2022. 5. 6. [JavaScript] var, let, const 차이점은? 🌈 var, let, const? 1. var : var 는 변수 재선언, 재할당이 가능하다. 유연한 변수 선언으로 간단한 테스트에는 편리할 수 있으나 코드량이 많아진다면 어디서 사용했는지 파악하기도 힘들뿐더러 값이 잘못 변경될 수 있는 가능성이 있다. a 에 변수에 A 를 할당 해준후, a 라는 변수에 다시 B 를 넣어보면 아래와 같은 결과를 확인할 수 있다. 같은 이름의 변수를 한 번 더 선언했음에도 불구하고, 에러가 나오지 않고 다른 값으로 변해버리는 결과를 확인할 수 있다. 2. let : var 의 단점을 보완하 위해 ES6 이후에 추가 된 변수 선언 방식이 let과 const 이다. let을 사용해서 위 예제를 test 해보면 재선언이 되지 않는 에러를 확인할 수 있다. 하지만, let 은 변.. 2022. 5. 5. [JavaScript] 저장해두면 유용한 정규 표현식 (Regular Expression) 🌈 저장해두면 유용한 정규 표현식 (Regular Expression) 1. 공백 체크 var regExp = /\s/g; 2. 영어 또는 숫자만 가능 var regExp = /^[A-Za-z][A-Za-z0-9]*$/; 3. 숫자만 가능 var regExp = /^[0-9]+$/; 4. 휴대폰 번호 체크 var regExp = /^01([0|1|6|7|8|9]?)-?([0-9]{3,4})-?([0-9]{4})$/; 5. 주민등록번호 앞자리 체크 var regExp = /^([0-9]{2}(0[1-9]|1[0-2])(0[1-9]|[1,2][0-9]|3[0,1]))$/; 6. 생년월일체크 var regExp = /^(19|20)\d\d([- /.])(0[1-9]|1[012])\2(0[1-9]|[12][0-.. 2022. 5. 3. [JavaScript] js 파일을 작성하고 node로 실행해보자! 🌈 간단한 함수를 작성해보고 node 로 js 파일을 실행해보자. npm, node.js 설치하기 1. helloWorld.js 라는 이름의 파일을 nano로 열어서 아래 코드를 입력해준다. 2. 생성한 피일을 실행한다. 아래와 같이 실행이 잘 된다면 Good😃 2022. 4. 29. [JavaScript] querySelector 함수 사용해보기 🌈 querySelector 함수 사용해보기 querySelector()는 제공자 선택자 또는 선택자 뭉치와 일치하는 문서 내 첫 번째 element를 반환한다. 일치하는 요소가 없다면 null을 반환하게 된다. 👉 querySelector를 이용하여 신문기사 제목 내 맘대로 바꿔보기 위 기사 제목을 querySelector를 이용하여 내 맘대로 바꿔보자! 제목의 class 이름을 먼저 확인해보자. 이 기사의 경우에는 class 이름이 "media_end_head_headline" 으로 설정되어 있다. console 창으로 넘어가 document.querySelector('.media_end_head_headline').textContent = "안녕하세요"; 다음과 같이 입력하면 기사 제목이 안녕하세.. 2022. 4. 27. 이전 1 다음 728x90
