01. Spread 연산자 - 스프레드(Spread) 연산자와 Rest 파라미터 iterable object의 element를 하나씩 분리하여 전개한다.iterable 객체는 반복 객체로써 객체의 원소에 하나씩 차례로 접근 가능하다. ' ... ' 점 세개로 시작해서 뒤에 이터러블 오브젝트를 써주면 된다.[...iterableObj]function(...iterableObj){ } 예시let first = [1,2];let last = [9,10];let result = [...first, 3,4,5,6,7,8, ...last]; console.log(result); 결과 값1,2,3,4,5,6,7,8,9,10 ...first를 전개하여 1,2의 값을 result의 배열에 넣어준다.그 후 3~8까지의 숫..
구글 API KEY생성하는 법 *google api 사용은 하루에 2,500건, 초당 10건의 요청에 한해서만 무료라고 합니다.그 이상 사용하려면 유료로 전환해야 한다고 합니다. 1. 구글 로그인을 합니다. 2.Google API 콘솔 이동 3.프로젝트 등록 ( 프로젝트 만들기 > 만들기 )최초로 들어오면 프로젝트가 없습니다.프로젝트가 있을 경우 Google APIs 옆 프로젝트 선택에서 프로젝트 선택하면 됩니다. 프로젝트 이름을 변경하면 아래 프로젝트ID값이 변경이 됩니다.수정 버튼을 눌러 ID값을 수정할 수 있는 것 같지만 어떠한 규칙에 의해 변경하는 것 같습니다. 저는 하지 않았습니다. 만들기 클릭 4.API 및 서비스 사용 설정방금 만든 프로젝트 (My project01) 선택된 모습이 보입니다...
CSS3 Selector :nth-child(n+n)를 알아보자 작업 중에 nth-child(n + 1) 이런 태그를 봤다.셀렉터는 자주 쓰던 것만 써서 봤다가도 까먹고는 하는데, 이번엔 까먹지 말아야지. :nth-child(1n+1);배수로 선택하기 예시를 봐보자 HTMLbox1box2box3box4box5box6box7 box8box9box10box11box12box13box14 CSSp{ margin:0; padding:0; }.box{ width:100px; height:100px; float:left; border:1px solid #ccc; border-left:0; box-sizing:border; color:#ccc;}.box:first-child{ border-left:1px solid ..
백엔드와 작업 시 파라미터 값을 보내야 하는 일이 빈번한데, 이번에 처음 겪은 이슈가 있어 작성해둔다. 이건 내가 작성한 ajax 코드가 아니었고, 유지보수 업무였다. (ajax 옵션을 잘 몰랐던 문제가 가장 컸다) 아래와 같이 작성했던 ajax 코드가 있었다. 데이터가 전송이 안되서 문제를 찾아보던 중에 processData를 알게되었다. JS $.ajax({ url : '', processData : false, contentType : "application/json", data : { id : 'abcd' }, type : "GET", success : function(res){ //....... } }); processData 란? 기본값은 true다. ajax 통신을 통해 데이터를 전송할때, ..
input에 데이터를 입력을 받을때, 해당 코드 포맷에 맞추어 입력해줘야하는 요구가 있었다. 디테일한 요구조건 1. 숫자만 입력 2. {0000 0000} 포맷 3. max 8자 HTML 해당 코드를 입력해주세요. (EX : 1234 5678) JS $('#code').on('input', function(){ var thisVal = $(this).val().replace(/\s|\D/g, ''); thisVal = thisVal.replace(/(\d{4})\B/g, '$1 '); thisVal = thisVal.substr(0,9); $(this).val(thisVal); }); CSS #code{margin-top:10px; display:block;} 문자를 입력받게되면 빈값으로 치환했고 그 다..