자바스크립트 문법 중, 많이 사용하는 배열, 객체배열 관계식을 정리해보았다. **두 배열의 교집합 찾기** const a2 = [1, 2, 3]; const a3 = [1, 2, 3, 4]; console.log(a2.filter(x=> a3.includes(x))); **객체 배열에서 속성 값을 배열로 추출** objArray = [ { foo: 1, bar: 2}, { foo: 3, bar: 4}, { foo: 5, bar: 6} ]; (예 : field `foo`는 array) `[ 1, 3, 5 ]`. function getFields(input, field) { var output = []; for (var i=0; i a.foo); 배열1개에서 중복값 제거 const uniqueArr = du..

CODING/Javascript 2022. 12. 25. 09:10

개발하면서 엄청나게 자주 사용한 함수(데이터 및 배열관리시 필수)들을 정리했던 내용이다. 두 배열의 교집합 찾기 const a2 = [1, 2, 3]; const a3 = [1, 2, 3, 4]; console.log(a2.filter(x=> a3.includes(x))); 두 배열의 차집합 찾기 const a2 = [1, 2, 3]; const a3 = [1, 2, 3, 4]; console.log(a2.filter(x=> !a3.includes(x))); 객체 배열에서 속성 값 배열로 추출 방법 1 다음 구조의 JavaScript 객체 배열이 있다. objArray = [ { foo: 1, bar: 2}, { foo: 3, bar: 4}, { foo: 5, bar: 6} ]; 각 객체에서 필드를 추출..

CODING/Javascript 2022. 5. 29. 16:59

자바스크립트 문법을 위한 예제(멋사 강의) //1. Date 객체 생성 var now = new Date(); //2. 연도를 가져오는 메서드 .getFullYear() console.log(now.getFullYear()); //3. 월 정보를 가져오는 메서드 .getMonth() {0: 1월, 1: 2월, ... 10: 11월, 11: 12월} console.log(now.getMonth()); //4. 일 정보를 가져오는 메서드 .getDate() console.log(now.getDate()); //5. 1970년 1월 1일 00:00:00을 기준으로 흐른 시간을 밀리초로 표시하는 메서드 .getTime() console.log(now.getTime()); //6. 특정 일의 Date 객체 생성 ..

CODING/Javascript 2022. 5. 28. 01:49

자바스크립트 문법을 위한 예제(멋사 강의) jQuery 기초 jQuery를 배워보자 클릭 // JQuery CDN을 찾아서 복붙 이제부터 스타크래프트 공식문서에서 fadeIn: J쿼리 공식문서에서 참조 []대괄호 내: 선택사항이라는 뜻임

CODING/Javascript 2022. 5. 28. 01:48

자바스크립트 문법을 위한 예제(멋사 강의) 자기소개 //onkeydown="counter();" ==> 이벤트함수: 키칠때마다 함수소환 (0/200)

CODING/Javascript 2022. 5. 28. 01:47

자바스크립트 문법을 위한 예제(멋사 강의) JavaScript 사용 방법 myscript.js> Math.random(); // 0이상 1미만의 실수(float) parseInt(); // 소수를 정수로 var num = Math.random() * 45 + 1; var ball1 = parseInt(num); var lotto = []; while (lotto.length a-b); // 숫자를 오름차순으로 정력 document.write(lotto); } }

CODING/Javascript 2022. 5. 28. 01:44

00:00 body { background-color: #2c3e50; } h1 { color: white; } .clicked { color: #7f8c8d; } .form, .greetings { display: none; } .showing { display: block; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .bgImage { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; animation: fadeIn 0.5s linear; } const toDoForm = document.querySelector(".js-toDoForm"), ..

CODING/Javascript 2020. 6. 9. 21:01

00:00 body { background-color: #ecf0f1; } h1 { color: #34495e; } .clicked { color: #7f8c8d; } .form, .greetings { display: none; } .showing { display: block; } const form = document.querySelector(".js-form"), input = form.querySelector("input"), greeting = document.querySelector(".js-greetings"); const USER_LS = "currentUser", SHOWING_CN = "showing"; function saveName(text) { localStorage.setIte..

CODING/Javascript 2020. 6. 9. 00:14

node.js 등 설치 yarn ceate react-app hello-react cd hello-react yarn start(cf. npm init react-app) 창 안열리면 강제입력(http://localhost:3000) import React from 'react'; // import: node_modules에서 리액트를 불러옴 webpack--> 합친(bundled) 자바스크립트 파일 --> 번들러 대표적인 번들러: 웹팩, Parcel, browserify 기본 시작파일: src/index.js svg파일: 로고나 아이콘 만들 때 쓰는 이미지 파일 웹팩의 로더라는 기능이 SVG파일이나 CSS파일 등을 불러와서 사용할 수 있게 만든다. babel-loader(자바스크립트 파일 불러와서 ES..

CODING/Javascript 2020. 6. 8. 15:58