JavaScript10 [JavaScript] Method 전체 모음집 1. 객체(Object) 메소드1.1. Object.keys(obj)객체의 키를 배열로 반환합니다.1.2. Object.values(obj)객체의 값을 배열로 반환합니다. 1.3. Object.entries(obj)객체의 키-값 쌍을 배열로 반환합니다.1.4. Object.assign(target, ...sources)하나 이상의 출처 객체의 모든 열거 가능한 속성을 대상 객체에 복사합니다. 1.5. Object.freeze(obj)객체를 동결하여 속성을 추가, 삭제, 수정할 수 없도록 합니다. 1.6. Object.seal(obj)객체를 봉인하여 새로운 속성을 추가할 수 없지만 기존 속성은 수정할 수 있도록 합니다. 1.7. Object.create(proto, propertiesObject)주어진 프.. 2025. 1. 17. 기존의 검색 데이터를 이용한 북마크 안의 검색 트러블 슈팅 : 개인과제를 하던중 검색창의 기능을 구현 하였다. 하지만 전체페이지와 북마크를 미리 불러왔을때 검색은 잘되지만 전체페이지의 화면에서 검색했을때 북마크보기를 클릭하면 내 북마크 안에 검색을 했던 영화가 있으면 그걸 보여주지 못한다는걸 보고 사용자가 불편하겠다 싶어 검색 기능을 수정하기로 하였다. 처음으로는 어떻게 로직이 돌아가야되나 생각해봤다 . 검색창에 검색을 하고 나서 북마크 보기 버튼을 클릭 했을때 검색창에 들어 가있는 영화 제목과 북마크 속에 들어있는 영화 제목을 비교하여 알맞은 것들만 불러온다 !! 첫번째로 버튼에 클릭 이벤트를 준다. 두번째 클릭 됬을시의 로직을 만들어 본다!! 이 함수는 현재 북마크 보기 버튼을 클릭 하였을때 북마크 보기에서 전체보기로 전체보기에서 북마크 .. 2025. 1. 16. JavaScript 모듈화 모듈이란js파일 하나에 들어있는 내용이 많아서 분리하게 될 때, 여러 개로 분리한 각각의 파일을 모듈이라고 부른다. 대부분의 브라우저에서 지원되지만, 인터넷 익스플로러에서는 지원되지 않으니 주의. 그리고 모듈은 로컬에서 동작하지 않는다. 로컬 실행 시 라이브 서버 등을 이용할 것. 자바스크립트에서는 일반적인 스크립트 파일과, 불러오기가 가능한 모듈 파일의 타입을 달리 하고 있다.//스크립트 파일//모듈 파일모듈 파일은 export 를 사용해 파일 내부의 함수를 외부로 내보낸다.//hello.jsexport function hello(name){ console.log(`hello, world! I'm ${name}!`);}모듈 파일을 불러올 때는 import 를 사용한다. 불러오는 함수는 중괄호 안.. 2025. 1. 15. [JavaScript] Localstorage를 이용하여 영화정보 저장 및 불러오기 오늘은 개인과제를 진행하면서 목록에 있는 영화를 북마크하는 방법에 대하여 공부하였다. 우선 크롬에는 저장소가 있는데 그걸 Localstorage라고 부른다. Localstorage는 읽기, 쓰기, 삭제등이 있다. 저장은 객체처럼 key-value값을 저장한다 하지만 LocalStorage는 스트링 형태만 받기 때문에 JSON.parseJSON.stringify의 형태로 변환 시켜줘야된다 JSON.stringify 는 객체를 스트링으로 형변환 시켜주고 반대로 JSON.parse는 스트링을 객체로 형변환 시켜준다. 다음과 같이 코드를 작성해보았다. 다음 코드는 로컬스토리지에 bookMarkItem이라는 키값으로 bookMarkList를 저장하고 불러온다.window.localStorage.getItem(.. 2025. 1. 13. 자바스크립트 동기 / 비동기(Promise, async/await) 프로미스 (Promise)프로미스는 말 그대로 약속 을 뜻하고, 프로미스는 자바스크립트에서 비동기 작업의 완료 또는 실패를 나타내는 객체입니다.내가 이 객체로 감싼 것들은 나중에 완료하기로 약속 하는거죠.프로미스는 크게 세 가지 상태를 가질 수 있습니다.대기 중 (Pending): 아직 결과를 받지 못한 상태.이행됨 (Fulfilled): 작업이 성공적으로 완료된 상태.거부됨 (Rejected): 작업이 실패한 상태.프로미스 생성(Producer)프로미스는 new Promise를 통해 생성할 수 있습니다. 생성자 함수(executer)는 두 가지 콜백 함수를 매개변수로 받습니다: resolve와 reject.프로미스 생성 예시:const promise = new Promise((resolve, rejec.. 2025. 1. 10. TMDB API 영화 데이터 (fetch)활용하여 불러오기 TMDB API 데이터 불러오기(fetch) 1. 영화 데이터를 가져올 수 있는 API를 제공하는 TMDB The Movie Database (TMDB)Welcome. Millions of movies, TV shows and people to discover. Explore now.www.themoviedb.orgTMDB 사이트를 접속한다음 -> 회원가입을 진행과 동시에 api 키값을 받고 로그인 하고 프로필 설정 들어가서 왼쪽 목록에 api를눌러보면 다음과 같은 화면이 나옵니다. 다음과 같은 화면이 나오면 문서라는 공간에 빨간색으로 칠해진 글씨가 있는데 여기를 클릭하면 개발자를 위한 문서가 등장합니다. 다음과 같이 api를 사용하는 방법에 대한 문서가 나오게 되는데 다 영어라서 당황 하지말고 위에.. 2025. 1. 8. 이전 1 2 다음
