초보개발자_기록

자바스크립트 forEach는 배열에 사용할 수 있는 메서드인데 map과 비슷 한 느낌이라 항상 헷갈렸는데 이참에 forEach를 간단히 정리해봐야겠다. 확실히 map과 사용하는 게 비슷해 보이는데, 차이점은 map은 return값이 있는데 forEach는 return값이 없다. 형태는 다음과 같다 Array.forEach(callback[,thisArg]); 두 번째 인자인 thisArg는 생략가능하다. --- 보통 다음과 같은 형태로 다들 이해하고 사용하는거같다. Array.forEach((배열요소,인덱스,배열자체값) => { 함수내용 }); 다음은 forEach를 이용하여 배열의 특정 조건에 해당하는 값을 제거하는 예시이다. const arr = [1,2,3,4]; const newArr = arr...

자바스크립트 2022. 7. 30. 15:54

1. 프로젝트 명 2. 프로젝트 소개 3. 와이어 프레임 4. 개발하는 기능 5. github 주소 1. 프로젝트 명 아워스케줄(Our Schedule) 2. 프로젝트 소개 개인 스케줄 및 모임 등 여러 사람들과 공동으로 스케줄 관리가 가능 3. 와이어 프레임 - 홈페이지 - - 로그인 페이지 - - 회원가입 페이지 - - 개인캘린더 - - 상세페이지 - - 회원정보 수정 - 4. 개발하는 기능 기능 Method URL request response issue 실패시 응답 회원가입 POST /api/user/signUp { id:, pw:, nickname: } 성공시 {msg:success} 실패시 {msg:} 비밀번호 확인 실패 중복된 아이디가 존재할시 중복된 닉네임이 존재할시 로그인 POST /ap..

자바스크립트 2022. 3. 7. 14:04

1. map 배열안의 값들에 변화를 주고싶을 때 사용. 예) const array_num = [0,1,2,3,4,5]; const new_array = array_num.map((array_item) => { return array_item + 1; }); 결과는 new_array에 [1,2,3,4,5,6] 이 들어감. (array_item 파라미터는 array_num 배열의 각요소들임. 이름은 자유롭게 작성 가능) 기존의 원본 배열 array_num은 값 변동없이 그대로 있음. map은 원본배열을 그대로 두고 새로운 것을 리턴함. 원본 배열 요소의 개수만큼 리턴. 2. filter 특정 조건에 만족하는 것만 골라내고 싶을 때 사용. 골격 배열.filter((number, index, source) =>..

자바스크립트 2022. 1. 19. 11:58

특정 문자가 문자열의 어느 index에 위치하는지 찾는 방법. 기본 골격 string.indexOf(searchvalue, position) 문자열(string)에서 특정 문자열(searchvalue)을 찾고, 검색된 문자열이 '첫번째'로 나타나는 위치 index를 리턴. 파라미터 * searchvalue : 필수 입력값, 찾을 문자열 * position : optional, 기본값은 0, string에서 searchvalue를 찾으려하는 시작 위치 찾을 문자열이 없으면 -1을 리턴 문자열을 찾을 때 대소문자를 구분 예제 출처 : https://hianna.tistory.com/379 예제1 const str = "abab"; document.writeln(str.indexOf('ab')); // 0 d..

자바스크립트 2022. 1. 19. 11:12

영화리뷰 사이트를 만들면서 각 영화의 평점(별5개)을 표시하려고 함. 스파르타코딩에서 제공해준 API 내용은 다음과 같음 movies : [ { comment : "~~~~", desc : "~~~~", image : "url", star : 4(또는 "4"), title : "영화제목" }, ... ] 이런식의 데이터를 불러옴. star키의 값으로 숫자가 들어있음. 처음에 생각한 것은 switch문이나 if를 사용해서 조건에따라 별을 입력해주는 방식이었음. function listing() { $('#cards-box').empty(); $.ajax({ url: "http://spartacodingclub.shop/web/api/movie", data: {}, type: "GET", success: f..

자바스크립트 2022. 1. 19. 11:02

'르탄이 나와'버튼을 누를때마다 하단의 이미지와 텍스트가 바뀜. html 코드 3. 르탄이 API를 이용하기! 아래를 르탄이 사진으로 바꿔주세요 업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다. 르탄이 나와 나는 ㅇㅇㅇ하는 르탄이! JS코드 function q1() { // 여기에 코드를 입력하세요 $.ajax({ url: "http://spartacodingclub.shop/sparta_api/rtan", data: {}, type: "GET", success: function (data) { let url = data['url']; let msg = data['msg']; $('#img-rtan').attr('src', url); $('#text-rtan').text(msg); } }) } ..

자바스크립트 2022. 1. 18. 09:54

지난번 TODO리스트 하면서 생긴 의문이 setAttribute로 onclick을 주입하면 작동이 되는지 궁금해서 시도해보았다. html코드 js코드 버튼들을 불러와서 배열로 담고, for문을 돌려서 각 버튼에 onclick을 부여하였음. 결과 잘 작동함. 개발자도구로 확인해보면 각 버튼에 onclick과 for돌릴때 부여한 index값도 들어가있음.

자바스크립트 2022. 1. 17. 23:26

HTML코드 오늘 할 일 고양이 밥주기 고양이 물, 사료 챙겨주기 완료 장보기 토마토, 계란, 초코렛 사기 완료 코딩하기 리엑트 강의 1주차 듣기 완료 짐정리하기 옷, 책위주로 정리 완료 다음은 자바스크립트 코드를 직접 작성해 보았음. const todoListArray = document.getElementsByClassName('todo__list'); const buttonArray = document.getElementsByTagName('button'); function done(e){ const array = e.target.id.split('__'); todoListArray[array[1]].style.backgroundColor='grey'; } for(let i=0;i

자바스크립트 2022. 1. 17. 22:40