본문 바로가기

분류 전체보기

(289)
DOM* 1 DOM을 이용해서 자바스크립트, css, html을 이어준다        css 선택자로 태그 가져오기.    자식 부모형제 노드 탐색 및 getElementById, querySelector
JavaScript* sort 함수 // 배열 데이터 정렬하기const nums = [6, 11, 3, 7, 9, 10, 2, 4, 1]console.log(nums);nums.sort((a, b) => a - b); // 오름차console.log(nums);nums.sort((a, b) => b - a); // 내림차console.log(nums);//nums.reverse(); // 내림차//console.log(nums); 숫자를 정렬하는 법은 비교적 문자에 비해 간단하다. 한줄로 활용하능하다.  userList.sort((a, b) => { if (a.userName > b.userName) return -1; else if (a.userName 문자의 경우에는 조건문으로 앞서올 문자를 구분해주면 된다. 리턴-1 처리 된쪽이..
JavaScript* 함수 Quiz2 // 4. **각 도시별로 발생한 총 거래액을 객체 형태로 매핑해주세요.// 예를 들어, `{서울: 총거래액, 부산: 총거래액}`과 같은 형태입니다.**console.log('=============================');const totalByCity = traders.reduce((totalByCity, trs) => { const city = trs.trader.city; totalByCity[city] = (totalByCity[city] || 0) + trs.value; return totalByCity;}, {});console.log(totalByCity);traders에서 reduce를 이용해 돌려준다 돌리는과정에 trs.trader.city를 다쓰기 귀찮으니 city값..
JavaScript* Reduce 함수 리듀스는 너무 어려웠다 지피티랑 얘기를 나누고 이해를 했다대화내용 적는게 제일 좋은듯네, 맞습니다. reduce 함수를 사용하여 최댓값을 찾는 방법은 정확히 그렇습니다. reduce 함수를 사용하면 주어진 배열의 모든 요소를 반복하면서 원하는 값을 누적하고 최종 결과를 반환할 수 있습니다.여기서 사용된 로직은 다음과 같습니다:reduce 함수를 호출하면서 초기값으로 가장 큰 값을 가진 거래자 객체(max)를 설정합니다.배열의 각 요소를 순회하면서 현재 요소(trs)의 거래액을 최댓값과 비교합니다.만약 현재 요소의 거래액이 최댓값보다 크다면, 최댓값을 현재 요소로 업데이트합니다.모든 요소를 순회한 후에는 가장 큰 거래액을 가진 거래자의 정보가 최종적으로 max에 저장되게 됩니다.이렇게 하면 for문을 사용..
JavaScript* 함수 Quiz 여기 예제가 있다.const traders = [ { trader: { name: "김철수", // traders[0].trader.name city: "대전", }, year: 2023, // traders[1].year value: 500000, }, { trader: { name: "박영희", city: "서울", }, year: 2022, value: 600000, }, { trader: { name: "김철수", city: "대전", }, year: 2022, value: 1200000, }, { trader: { name: "박영희", c..
JavaScript* 배열고차함수 활용 사과바구니를 가져왔다 const appleBasket = [{ color: 'green', sweet: 13},{ color: 'red', sweet: 14},{ color: 'red', sweet: 11},{ color: 'green', sweet: 6},{ color: 'green', sweet: 7},{ color: 'green', sweet: 9},]; 문제.  /* 사과중에 녹색이면서 당도가 9인 사과만 선별하여 // filtering 1 "이 사과는 xx색이며 당도는 xxx입니다" // mapping 2 라는 문자열이 들어있는 배열을 만들어tj 콘솔에 반복출력해주세요. // forEach  */ const filteredApples = appleBasket.filte..
JavaScript* 배열고차함수 const userList = [ { account: 'abc1234', userName: '대길이', job: '추노', address: '서울', hobbys: ['수영', '축구', '테니스'], salary: 5400000, age: 35, }, { account: 'banana', userName: '빠나나', job: '과일', address: '서울', hobbys: ['푸드파이팅', '테니스'], salary: 9700000, age: 18, }, { account: 'park1234', userName: '주차왕', job: '발렛파킹', address: '경기', hobbys:..
JavaScript* 콜백 (Callback) 콜백이란??함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수를 콜백 함수라고 하고, 매개 변수를 통해 외부에서 콜백 함수를 전달받은 함수를 고차 함수라고 한다. 콜백의 핵심 : 동작을 파라미터화한다if문에 들어있는 조건식들만 파라미터로 전달한다면 쉽게 해결자바스크립트의 함수는 일급 객체라서 함수에게 다른 코드를 전달하는 것이 가능.단, 전달할 코드가 함수에 묶여있어야 한다는게 포인트 // 어떤 계산을 하는 함수function operate(param) { console.log(`param = ${param}`); const x = param(10, 20); console.log('계산기 작동!!'); const n1 = 10, n2 =20; const result = param(n1,n2..