목록전체 글 (141)
뉴히의 개발 로그
문자열 치환 replace() 함수, split(), join() 검색시에 공백을 제거해서 띄어쓰기가 틀리거나 해도 모두 검색이 될 수 있도록 split으로 공백을 기준으로 쪼개고 join으로 공백을 없애 주도록 했는데 튜터님께 코드 피드백 받는도중 저건 왜 split으로 쪼갠거죠? 하셔서 ㅎㅎㅎㅎㅎㅎ 코드봤을때 조금 의아했다! 하시며 replace 함수를 쓰는게 어떻겟나? 하셔서 변경해보앗다. 기존코드 const matchMovies = movies.filter((item) => { let titles = item.original_title.split(' ').join('').toLowerCase(); inputValue = inputValue.split(' ').join(''); return titl..
문제 : fontawesome 아이콘 네모박스 오류 서칭해보니 이렇게 간단하다니!? 해결 : fas, fab class 앞쪽에 fas, fab를 넣었더니 바로 나타났다!!!!!!!!!!!!!!!!!!!!!!! svg로 넣으면 잘보이긴하나 컬러변경이나 사이즈 조정등이 더 불편해서 아이콘으로 사용하는편이 좋은듯하다. Font Awesome이 버전 5로 업데이트되면서 사용법이 복잡해졌다고 한다. 유료화가 되면서 스타일을 5가지로 분리했고, 2가지는 무료, 3가지는 유료로 사용할 수 있게 바뀌었다고 한다. 매번 쓸때마다 자꾸 오류가 떠서 화나지만... 예쁜 아이콘 그리는거보단 나으니 ㅎㅎㅎㅎㅎㅎㅎㅎ 폰트어썸 오류 해결! 참조 https://velog.io/@snsnahtmxm/Font-Awesome-%EC%98..
alert창 한번만 띄우기 !!! 어제 if 문으로 해결 된지 알았으나 아니었던것! 그 이유는! movies.forEach 안의 if문이라서 movies를 다 돌때 까지 alert창이 뜨는것 이였다 ㅎㅎㅎㅎ console창을 보면 알 수 있다! console을 잘 찍어봐야 하는 이유! let searchBtn = document.getElementById("search-btn"); searchBtn.addEventListener("click", function(){ let temp_html = ''; // input 입력값 let inputValue = document.getElementById("search-input").value.toLowerCase(); console.log('입력값->',inpu..
클로저 closure 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합니다 // 카운트 상태 변경 함수 #3 const increase = (function () { // 카운트 상태 변수 let num = 0; // 클로저 return function () { return ++num; }; })(); // 이전 상태값을 유지 console.log(increase()); //1 console.log(increase()); //2 console.log(increase()); //3 1. 위 코드가 실행되면, '즉시 실행 함수'가 호출 -> 함수가 반환(inner) -> increase에 할당 (function () { // 카운트 상태 변수 let num = 0; // 클로저 return functi..
! [rejected] master -> master (fetch first) error: failed to push some refs to 'github.com:heejung-newheee/Movie-list.git' hint: Updates were rejected because the remote contains work that you do hint: not have locally. This is usually caused by another repository pushing hint: to the same ref. You may want to first integrate the remote changes hint: (e.g., 'git pull ...') before pushing again. ..
원래 제이쿼리에 조금 더 익숙했던 나 요즘은 바닐라자바스크립트를 쓴다고한다. 이유는 아무래도 jquery는 라이브러리기 때문에 용량이 크고 바닐라자바스크립트보다 느리다고한다. 초반에는 느렸던 javascript가 크롬을 만나면서 기술이 좋아지고 속도가 많이 향상되어 지금은 더 빠르기 때문에 jquery문법보다는 순수 javascript를 쓰는 추세라고 한다! 하지만, 직관적으로 보기 쉽고 이해하기 쉬운 코드는 jquery인것은 무시하지 못한다! $(document).ready(function(){ }); $(function(){ }); => window.addEventListener("DOMContentLoaded", function(){ }); window.addEventListener("load", ..
Promise Promise는 프로미스가 생성된 시점에는 알려지지 않았을 수도 있는 값을 위한 대리자로, 비동기 연산이 종료된 이후에 결과 값과 실패 사유를 처리하기 위한 처리기를 연결할 수 있다. 프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있다. 다만 최종 결과를 반환하는 것이 아니고, 미래의 어떤 시점에 결과를 제공하겠다는 '약속'(프로미스)을 반환한다. Promise는 비동기 처리에 대해, 처리가 끝나면 알려달라는 ‘약속’ new 연산자로 호출한 Promise의 인자로 넘어가는 콜백은 바로 실행 그 내부의 resolve(또는 reject) 함수를 호출하는 구문이 있을 경우 resolve(또는 reject) 둘 중 하나가 실행되기 전까지는 다음(then), 오류(cat..
오늘은 콜백함수를 공부하고 있었는데 map 함수를 배웠다. 엇? 근데 이전에 map 객체도 배웠는데! 이름이 같아? 해서 정리해봤다. 자료구조 Map(Object) 와 .map() 함수(메서드) Map : key값으로 속성에 접근할 수 있다. (검색, 삭제, 제거, 여부확인 등의 기능 가능) ('key', 'value') 프로그래밍의 부족한 부분을 보완하기 위해서 Map, Set 같은 추가적인 자료구조(데이터 형태)가 등장 Map의 메서드 : keys, values, entries Map의 key는 모든 값(함수, 객체 또는 원시값 포함)이 될 수 있습니다. const contacts = new Map() contacts.set('Jessie', {phone: "213-555-1234", address:..