목록javascript (7)
우주먼지 개발 log
금액을 표시할 때 뭔가 빠진것 같다 싶었는데, 콤마도 찍고 통화 기호도 찍어주어야했다.하지만 이정도는 추가 라이브러리 설치 없이도 다 제공..^.^아래 3가지 방법이 있다.1. 내장 라이브러리 Intl.Numberformat 사용하기지역 및 통화 옵션 설정 시 알아서 표기해줌!https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormatconst number = 123456.789;console.log( new Intl.NumberFormat('ko-KR', { style: 'currency', currency: 'KRW' }).format( number, ),);// Expecte..
해설강의에서 나왔던건데, 여튼 한번만봐도 다 기억나면 얼마나 좋을까... html 폼데이터를 쉽게 보내도록 도와주는 객체 FormData 메서드 FormData에 속하는 필드는 아래와 같은 메서드로 수정할 수 있습니다. formData.append(name, value) – name과 value를 가진 폼 필드를 추가 formData.append(name, blob, fileName) – 형태의 필드를 추가. 세 번째 인수 fileName은 (필드 이름이 아니고) 사용자가 해당 이름을 가진 파일을 폼에 추가한 것처럼 설정해줌 formData.delete(name) – name에 해당하는 필드를 삭제 formData.get(name) – name에 해당하는 필드의 값을 가져옴 formData.has(nam..

React App 처음 생성했을 때 이미지가 돌아가는 것에 대해 생각해 본적이 없었는데, 이제야 갑자기 궁금해져서 얘 gif 인가? 했는데 아니었다. css를 통한 애니메이션 효과였던 것이다. ㅇ0ㅇ 팀플 후에 css의 중요성을 깨달았고 이제 공부를 좀 하려고 한다. 우리 팀원들이 이미지 움직이는 것을 많이 넣었는데, 바빠서 확인을 못했었는데 모두 animation 이었다 ㅇ0ㅇ 우리 KPT 회고에서 제일 많은 투표를 받은 지난 코드도 다시보자! 라는 Try 를 수행하기 위해 우리 팀 css 부분도 다시 뜯어봐야겠다^.^ 1) 데이트 코스 등록이라는 글자를 띄워주는 StyledDateTitle 라는 styled-components 가 있다 데이트코스 등록 💟 2) 여기있다! shakeAnimation은 ..

javascript 메소드의 불변성을 확인해주는 사이트 Does it mutate? Does it mutate? The lastIndexOf() method returns the last index at which a given element can be found in the array, or -1 if it is not present. The array is searched backwards, starting at fromIndex.Array.prototype.lastIndexOf ( searchElement [ , fromIndex ] ) doesitmutate.xyz mutate : 변형되다 객체나 리스트 내에 변형을 일으키는 메소드는 === 불변성을 유지해주지않는다고 말할 수 있다. 예를 들어 ..

reduce() 메소드 이해하기 reduce 는 "누적하다" 라는 뜻으로 배열의 값들을 누적해서 처리하고 싶을 때 쓰인다. 매개변수로 누적값과 현재값을 가진다. acc 와 c 로 종종 표현해준다. (accumulator, currentValue 이런 약자) 배열을 돌면서 return에 적힌 값으로 acc를 업데이트 해준다. 이해가 잘 되지 않으므로 테스트를 해본다. react 수업 듣는 중이라 react 프로젝트 이벤트핸들러함수에서 뜯어온 코드지만 안에 내용물만 보자. 결과물은 아래와 같다. console.log로 acc와 c 를 찍어보자. 여기서 처음에 알수 있는 것 한가지는 reduce함수가 처음 돌 때 acc 와 c 는 처음에 인덱스 0번, 1번 있는 것을 넣어준 다는 것이다~! 그러면 아래처럼 수..

css 관련 지식은, 남보다 더 정리를 잘 할 필요도, 자신이 없으므로 펌 모드~~ 찾은 것 중에 제일 잘되있는 걸로! 나중에 다시 찾아보기 위함 CSS / border-radius / 테두리 둥글게 만드는 속성 border-radius border-radius는 테두리를 둥글게 만드는 속성입니다. CSS3에서 정의되었으며, IE는 버전 9부터 지원합니다.(IE8에서 사용하는 방법) 8개의 속성 값을 넣어야 하지만, 값이 같다면 짧게 쓸 수 www.codingfactory.net 그래서 내가 하고싶었던 것은 두구두...구... 몰라 나름 귀엽다~ 글자 위아래를 가운데로 정렬하기 위해 line-height 를 박스의 크기와 같게 해줌. const StLi = styled.li` width: 80px; he..
그냥 나중에 가져다 쓰려고 저장~ 검색해서 찾아서 써도 되지만... reset.css 파일 만들기 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, arti..