본문 바로가기

Language/Javascript24

jQuery 사용하기 HTML 요소들을 조작하는 편리한 Javascript 라이브러리로 사용전에 import 해주어야 한다. jQuery를 사용하기 위해서는 미리 작성된 자바스크립트 코드를 import 해와야 하는데, bootstrap css 파일을 가져올 때와 마찬가지로 내 컴퓨터에 해당 파일을 저장해서 사용할 수도 있지만 온라인 상의 파일을 참조할 수도 있다. 이를 head 태그 안에 넣어주면 된다. 또한 CSS와 마찬가지로 특정 요소를 가리켜야 조작할 수 있는데, CSS에서는 주로 class를 사용했다면 jQuery에서는 고유한 하나의 요소를 가리키는 id를 주로 사용한다. input 박스의 값 가져오기, 값 변경하기 let url = $('#article-url').val() url 'https://kimjingyu... 2023. 8. 6.
비동기 처리법 ES6 - Promise : 비동기 처리 결과를 반환한다. ES8 - async/await : 비동기 처리를 마치 동기처럼 동작하게 한다. 2023. 6. 3.
map과 filter map과 filter 모두 배열의 내장함수이다. map 배열의 원소를 일괄적으로 변형시킬 때 사용하기 좋다. const classmate = ["철수","영희","훈이"] classmate.map((item)=>(item+"어린이")) const classmate = [ {name: "철수"}, {name: "영희"}, {name: "훈이"} ] classmate.map((item)=>({name : item.name + "어린이", school : "떡잎유치원"})) 실무에서는 컴포넌트의 return 값 안에서 많이 사용한다. map을 return 값 안에서 사용하기 위해서 { } 으로 감싸서 사용한다. // RenderMap 컴포넌트 export default const RenderMap = ()=>.. 2023. 5. 10.
falsy한 값 6가지 0 "" false null undefined NaN 2023. 5. 10.
jQuery란? ✍️ 정의 javascript 언어를 간편하게 사용할 수 있도록 단순화시킨 오픈 소스 기반의 자바스크립트 라이브러리 HTML의 DOM 조작과 이벤트 제어, 애니메이션 그리고 Ajax까지 웹 화면을 다루는 자바스크립트 라이브러리 지금은 Angular, React, Vue 와 같은 화면을 다루는 여러 기술들이 있지만, 그전에 화면 개발을 쉽게 해주는 라이브러리였다. 📘 Write less, do more - jQuery가 가지 철학 즉, 적은 코드로 생산성을 높이자는 뜻으로 해석할 수 있겠다. jQuery가 제공하는 기능 DOM과 관련된 처리를 쉽게 구현할 수 있다. 규칙성을 가지고 이벤트를 처리할 수 있다. 애니메이션 효과를 쉽게 만들 수 있다. Ajax 처리 방식을 편리하게 사용할 수 있다. 🔎 제이쿼리.. 2023. 5. 2.
Rest Parameter let origin = { name: "user", age: 20, petName: "dog", hobby: "playing game" } const { petName, hobby, ...rest } = origin console.log(rest) // { name:"user", age:20 } 2023. 3. 21.