클로리셔 작은 공간

sort( ) / reverse( ) 함수로 순서 정렬하기 01. sort() : 알파벳 순서로 요소 정렬 const names = ["Chloe", "Andy", "Jake", "David"]; names.sort(); console.log(names); // ['Andy', 'Chloe', 'David', 'Jake'] 02. reverse() : 역순으로 요소 정렬 const names = ["Chloe", "Andy", "Jake", "David"]; names.reverse(); console.log(names); // ['Jake', 'David', 'Chloe', 'Andy'] sort( ) 함수로 올림차순/내림차순 최소값/최대값 반환 sort((a, b) => {return a-b}) : ..

addEventListener 이벤트 작업을 하다가 몰랐던 이벤트들도 많길래 한번 정리를 해보았다. 자주보다보면 익숙해지겠지..ㅎㅎ 자주쓰는 메서드는 따로 표시 해두도록 해야지! 이제 나도 이벤트 메서드 전문가!!! 브라우저 UI와 상호작용 이벤트 이벤트 설명 load 웹 페이지 로드 완료되었을때 unload 웹 페이지가 언로드 될 때(새로운 페이지 요청한 경우) error 오류를 만났거나 요청한 자원이 없을 때 resize 브라우저 창 크기를 조정했을 때 scroll 사용자가 페이지를 위아래로 스크롤 할 때 키보드 이벤트 - 사용자가 키보드를 작동했을 때 이벤트 설명 keydown 사용자가 키를 눌렀을 때 keyup 사용자가 키를 뗄 때 keypress 사용자가 눌렀던 키의 문자가 입력 되었을 때 마우..

변수에 넣어논 특정값들을 변수에 쉽게 담을 수 있는데 그것을 비구조화 할당이라고 한다. 만약 비구조할당이 없을때는 어떻게 작업을 해야했는지에 대한 불편함을 알아보자. 1. 배열 데이터값을 이용한 비구조화 할당 const names = ["Chloe", "Jake", "David", "Tom"]; const name1 = names[0]; const name2 = names[1]; const name3 = names[2]; const name4 = names[3]; console.log(name1);//Chloe console.log(name2);//Jake 이렇게 배열에 담긴 값들을 변수 하나 하나 각자 생성해서 각 [ index ] 넘버를 지정 설정하면서 할당했다. 4개까지는 쌉가능이지만... 만약 배..

문자를 숫자로 변환할 수 있는 내장함수 1. parseInt (변환할 값) - 해당값을 정수로 반환 const num = "5"; const num1 = "5.7" console.log(parseInt(num)); // 5 console.log(parseInt(num1)); // 5 // 반올림 상관없이 정수로 무조건 반환. 2. parseFloat (변환할 값) -해당값을 실수로 반환 const num = "5.8"; const num1 = "5.3"; console.log(parseFloat(num)); // 5.8 console.log(parseFloat(num1)); // 5.3 // 소수점 살려서 실수로 무조건 반환

1. indexOf( ) - 찾고자하는 문자열의 위치 반환 2. slice( ) - 문자열에서 특정 부분 찾아서 새로운 문자열로 반환 3. substr( ) - 문자열에서 특정 부분 잘라냄 4. replace( ) - 문자열에서 특정 문자값 바꿔치기 5. split( ) - 문자열을 배열로 반환 1. 문자열.indexOf() - 찾고자하는 문자열의 위치 반환 const txt = "Hello World"; console.log(txt.indexOf("apple")); // -1 apple이란 단어를 찾기했을 때, 값이 없으면 -1을 반환한다. 만약 글자가 있다면 그 글자의 위치를 찾아서 숫자로 반환. indexOf는 단어가 있는지 없는지 확인할 때 사용을 많이 한다고한다. 2. 문자열.slice() - ..

자바스크립트에 미리 포함 된 함수를 내장함수라 한다. 배열에 사용하는 반복문 내장함수에는 forEach() / map() 이 있는데 알아보자. forEach() / map() 에는 파라미터(인자)값이 3가지가 들어간다. ex) forEach( el, idx, arr ) el : 반복 돌고있는 대상 idx : 순서값 arr : 배열자체 1. forEach() const colors = ["red", "green", "blue"]; colors.forEach((el, idx, arr) => { //파라미터에는 3가지가 default.(반복도는 대상, 순서값, 배열자체 ) console.log(el); //red green blue console.log(idx); // 0 1 2 console.log(arr)..

1. for() 반복문 1-1) 배열에서 for() 이용하기 // 배열에서 사용법 const colors = ["red","green","blue","aqua"]; for( let i=0; i < colors.length; i++ ){ console.log(colors[i]); //red green blue aqua } 1-2) 객체에서 for() 이용하기 // 객체에서 사용법 const classA = [ {name: "Chloe", age: 20, address: "Seoul"}, {name: "Andy", age: 25, address: "Busan"}, {name: "Jane", age: 18, address: "Daegu"}, ]; for(let num=0; num < classA.length;..

자바스크립트에서 연산자 공부할 때 +, -, /, * 등등 이해가 잘 가는데.. +=는 매번 헷갈렸다. 그래서 정리를 해보았다..! let num1 = 2; num1 = num1 + 2; console.log(num1); //num1은 2 + 2가 되어서 4가 나온다. //// 이것을 함축형으로 바꾸면 num1 += 2; // 자기자신 num1(초기값)에다가 2를 더한다는 의미 console.log(num1); //4 결국은 num1 + 2 라는 의미.. easy하네

리액트 프로젝트를 시작할때 첫 셋팅과 진행방법을 정리해서 포스팅하려고 한다. 우선 git / Node JS / npm / yarn 설치가 되어있어야한다. * git 설치 확인 git --version * Node JS 설치확인 node -v * npm 설치 확인 npm -v * yarn 설치 확인 yarn -v 1. React 프로젝트 만들기 yarn create react-app 프로젝트명 - VScode를 열어서 터미널에 이 명령어를 넣는다. BUT!! 제대로 했는데 혹시나 이런 오류가 뜬다?! ( 뭐하나 한방에 되는게 엄숴.. ) Error Couldn't find a package.json 영어에 당황하지 말자, 이제 영어에 더 이상 쫄면 안된다.. 익숙해져야한다...... 해석해보면 packag..