Array.prototype.reduce() reduce() 메소드는 배열의 각 요소에 대해 주어진 리듀서(reducer)함수를 실행하고, 하나의 결과값을 반환 각각의 배열 요소에 콜백함수를 실행하고 결과를 누적한 최종 답이 필요할 때 유용함 (e.g.배열 요소의 전체 합을 구할 때) const array1 = [1, 2, 3, 4]; // 0 + 1 + 2 + 3 + 4 const initialValue = 0; const sumWithInitial = array1.reduce( (previousValue, currentValue) => previousValue + currentValue, initialValue ); console.log(sumWithInitial); // expected output..
서울시 OpenAPI(미세먼지) http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99 -> JSON형식으로 된 파일을 정돈된 형태로 보기위해서는 chrome 확장 프로그램 JSON View를 설치해주시면 됩니다. 🌞여기서 JSON은 key : value 로 이루어진 딕셔너리와 비슷한 서버통신용 표준 포맷이라고 생각하면 된다. 위의 내용을 보면 RealtimeCirtAir라는 딕셔너리(JS에서 객체)에 key : value의 형태로 들어가있고 key가 row인 곳의 value로 리스트(JS에서 배열)가 들어가 있고 해당 리스트안에 또 딕셔너리가 담겨있다. (어지럽군요^^) 🌞API란? 간단히 말하면 은..
🌞jQuery 란? HTML의 요소들을 조작하는 편리한 Javascript를 미리 작성해둔 것이다. (JS 라이브러리) 즉, 미리 작성된 JS코드이다. 다른 사람이 짜둔 코드를 가져와서 사용하는 것이기 때문에 쓰기 전에 import 를 해야 합니다. jQuery를 쓰면 javascript보다 더 직관적이고 간편하게 쓸 수 있다. ▶JS와 jQuery 코드 비교 //JS 코드 document.getElementById('element').style.display = 'none'; //jQuery ver 좀 더 직관적인 코드 $('#element').hide(); 🌞jQuery 사용방법 직접 파일을 가져와서 쓰는 방법도 있지만 google CDN을 통해서 코드 임포트 후 사용한다. //google CDN 🌞..
🌞자바스크립트란? -프로그래밍 언어 중 하나로, 브라우저가 알아들을 수 있는 언어(표준) 클라이언트가 서버에 요청하면, 서버가 클라이언트에게 HTML + CSS + JS를 준다. 프로그래밍 언어를 배울 때 기억해야할 5가지 ->변수, 자료형, 함수, 조건문, 반복문 파이썬에서는 데이터값을 저장하기 위해 리스트와 딕셔너리를 가장 많이 사용한다. 리스트는 다른 프로그래밍 언어에서는 array(배열)라고 부르기도 한다. 자료형에서 유의 깊게 봐야할 개념 2가지(리스트, 딕셔너리) 🌞리스트 자바스크립트에서 배열(Array)을 말한다. 리스트는 리스트 내 값의 위치(index)와 그 위치에 있는 값의 정보(value)를 저장한다. 리스트는 key값이 없고(대신 index값, 위치정보)가 있음 어떤 값을 찾을 때 ..
🍕BootStrap 이란? 간단히 말하면 예쁜 CSS를 미리 모아둔 것 (CSS를 다룰 줄 아는 것과, 미적 감각을 발휘하여 예쁘게 만드는 것은 다른 이야기이기 때문에, 현업에서는 미리 완성된 부트스트랩을 가져다 쓰는 경우가 많다. 오픈 소스 프론트엔드 프레임워크이다. PC용 디자인 뿐만아니라 태블릿이나 스마트폰 같은 모바일용 디자인을 반응형으로 한번에 지원한다. 여러 웹 브라우저를 지원하기 위한 크로스 브라우징 걱정 X 부트스트랩은 반응형이며 모바일 우선인 웹프로젝트 개발을 위한 가장 인기있는 HTML, CSS, JS 프레임워크다. https://getbootstrap.com/docs/5.0/components/card/ Cards Bootstrap’s cards provide a flexible an..
※하나몬 님의 스코프 , 클로저 개념을 바탕으로 각색되었습니다! 자세한 내용은 아래에 첨부된 원문 링크를 통해서 참고하시길 바랍니다. 🍕return 명령문? 함수 실행을 종료하고, 주어진 값을 함수 호출 지점으로 반환한다. function getRectArea(width, height) { if (width > 0 && height > 0) { return width * height; } return 0; } console.log(getRectArea(3, 4)); // expected output: 12 console.log(getRectArea(-3, 4)); // expected output: 0 구문 return [[expression]]; expression 반환할 값으로 사용할 표현식. 생략할..
※해당 글은 하나몬 님의 원글을 바탕으로 수정 추가되었습니다. 맨아래 링크 참고 🍕정규 표현식이란(regular rexpression)? - 일정한 '패턴'을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어(formal language)이다. 정규 표현식은 JS의 고유 문법이 아니며, 대부분의 프로그램 언어와 코드 에디터에 내장되어 있음 JS(자바스크립트)의 경우, 정규 표현식 문법을 ES3부터 도입했다. 단점) 정규 표현식은 주석이나 공백을 허용하지 않고, 여러 기호를 혼합해 사용하기 때문에 가독성이 좋지 않다. 🍕정규 표현식의 역할 문자열을 대상으로 '패턴 매칭 기능'을 제공 (*특정 패턴과 일치하는 문자열을 검색, 추출, 치환(대체)할 수 있는 기능을 말한다.) 반복문과 조건문 없이 패턴을 ..
자바스크립트에는 3종류의 논리 연산자가 있음 ||(OR), &&(AND), !(NOT) 논리 연산자는 피연산자로 boolean형뿐만 아니라 모든 타입의 값을 받을 수 있다. 연산 결과 역시 모든 타입이 될 수 있음! 🍕 || (OR) -전통적인 프로그래밍에서 OR연산자는 불린값을 조작하는데 쓰인다. 인수 중 하나라도 true이면 true를 반환합니다. OR연산자는 이항 연산자이므로 아래와 같이 사용할 수 있습니다. alert( true || true ) // true ->피연산자가 모든 false인 경우를 제외하고 연산결과는 항상 true입니다. 피연산자가 불린형이 아니라면, 평가를 위해 불린형으로 변환됩니다. 예를 들어, 1 과 0은 연산과정에서 1은 true로 0은 false로 바뀝니다. if(1 |..
- Total
- Today
- Yesterday
- 원티드 FE 프리온보딩 챌린지
- 틸드와 캐럿
- 형제 요소 선택자
- 항해99프론트후기
- ~ ^
- reactAPI
- 프리온보딩 프론트엔드 챌린지 3월
- 타입스크립트 DT
- is()
- fs모듈 넥스트
- 원티드 3월 프론트엔드 챌린지
- nvm 설치순서
- D 플래그
- 부트캠프항해
- float 레이아웃
- 타입스크립트 장점
- 항해99프론트
- grid flex
- 프리렌더링확인법
- tilde caret
- 항해99추천비추천
- getStaticPaths
- 원티드 프리온보딩 FE 챌린지
- && 셸 명령어
- aspect-ratio
- getServerSideProps
- text input pattern
- Prittier
- nvm경로 오류
- 원티드 프리온보딩 프론트엔드 챌린지 3일차
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |