JavaScript & jQuery18 JavaScript - Callback & Promise & Async/Await JavaScript - Callback & Promise & Async/Await 자바스크립트는 다른 언어들과는 다르게 싱글 스레드를 사용하는 언어이다. 이 말은 즉, 한번에 한개의 일만 순차적으로 처리한다는 말과 같다. 병렬 처리를 할 수 없어 자바스크립트에서는 비동기 non-blocking 방식을 통해 해결한다. 이 방식을 쉽게 예를 들면 식당에서 손님과 종업원과 요리사가 있다고 했을때 동기 방식에서는 손님한명한테 주문을 받고 요리사에게 주문을 건내주어 음식이 나올때까지 다른 손님의 주문을 받지 않고 기다렸다가 음식이 나오면 갖다주고 다음 주문을 받는 것이라 생각하면 이해가 쉽다. 비동기 방식은 반대로 주문을 받고 요리사에게 주문을 알려주고 음식이 나올때까지 기다리는 것이 아니고, 다음 주문을 받으러.. 2021. 6. 27. Javascript - Callback 함수 Javascript - Callback 함수 메서드안에서 매개인자로 사용될 수 있는 함수를 콜백함수라고 부른다. 해당 메서드가 호출이 될때 실행이 되므로 호출을 기다리고 있다고 해서 콜백함수이다. 예로써 javascript의 메서드중 하나인 sort메서드로 예를 들어본다. sort메서드에는 인자로 콜백함수를 사용할 수 있다. 디폴트값으로는 아무것도 안넣으면 오름차순으로 정렬하며 내림차순이나 정렬을 안하고 싶을시에는 아래와 같이 콜백함수로 사용될 함수를 정의하면 된다. 콜백함수로 사용될 함수가 사용 빈도수가 낮거나 테스트로만 진행할시에는 굳이 이름을 주지 않고 익명함수로 정의하여 사용하면 코드가 좀더 간결하게 짤수도 있다. 2021. 6. 10. A 태그에서의 this 인자 전달 - href, onclick A 태그에서의 this 인자 전달 - href, onclick A(ahchor)태그에서 자바스크립트 함수를 호출하는 방법에는 2가지가 있다. 1. href="javascript:" 2. href="javascript:" onclick=""; 하지만 href를 사용했을때는 undefined가 찍힌다. onclick을 이용하도록 한다. 예제 코드) function callFunction(obj) { console.log($(obj).attr("attr-a")); } javascript function onclick function ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ -> 현재 페이지를 가리킴. 호출시 페이지 상단으로 올라가는 단점이 있음. or -.. 2021. 6. 9. JavaScript - var, let, const 차이 JavaScript - var, let, const 차이 ES6 이후에 추가 된 변수 선언 방식 let과 const에 대해서 어떤 차이가 있는지 정리한다. 먼저 var는 변수 선언 방식에 있어서 장단점이 있다. 아래와 같이 선언 후 사용을 하더라도 에러가 나오지 않고 각기 다른 값이 출력된다. 간단한 테스트상에서는 이런 유연한 변수 선언이 도움이 될 수 있지만 코드량이 많아진다면 값이 바뀔 우려가 있기 때문의 주의를 해야한다. 이러한 점을 보완하고자 나온 것이 let과 const 변수 선언 방식이다. let으로 선언을 변경 후 같은 코드를 실행해보면 다음과 같이 이미 선언이 되어있다는 에러 문구가 나온다. const로 선언했을때도 마찬가지이다. let과 const의 차이점은 let은 변수에 재할당이 가능.. 2021. 5. 27. Ajax - 개념 및 사용법 (동기, 비동기) 들어가며 헷갈리는 Ajax 관한 내용을 정리한다. Ajax (비동기식 자바스크립트와 XML) - Asynchronous Javascript And XML 의 약자로 자바스크립트의 라이브러리 중 하나이다. - 자바스크립트를 통해서 비동기식으로 서버에 데이터를 요청하여 필요한 데이터를 받아와 전체 페이지를 새로 고치지 않고 변경이 필요한 페이지 부분만을 고치는 기법 EX) 상품의 정렬 방식에 따라서 상품 리스트가 다르게 뿌져진다고 했을때 정렬 방식을 바꿀때 마다 페이지를 리로드하는 것보단 정렬 방식을 바꿀때(요청) 페이지에서 변해야하는 부분은 상품 리스트뿐이기때문에 비동기 방식을 이용하여 해당 정렬에 맞는 데이터만 서버에 요청하여 데이터를 가져와 뿌려준다. - Ajax의 주목적으로는 화면 전환 없이 클라이언.. 2021. 5. 8. JavaScript - window.onload() JavaScript - window.onload() window.onload() 란? - 자바스크립트에서 페이지가 로드되면 자동으로 실행되는 전역 콜백함수이다. - 페이지의 모든 요소들이 로드외어야 호출된다. - 한 페이지에서 하나의 window.onload()함수만 적용된다. 그럼 이러한 함수를 언제 쓸까? html 내의 요소들을 움직일수 있는 dom객체를 조작하는 방식때 javascript를 사용한다. 하지만 위로부터 차례차례로 읽어들이는 인터프리터 언어적 특성으로 인하여 자바스크립트 작성 위치에 따라 오작동을 일으키기도 한다. 바로 이때 window.onload() 함수를 이용하여 이러한 오작동을 방지할 수 있다. 예를들어 html head 부분에 작성된 문이 있다고 가정한다. hello 라 작성되.. 2021. 4. 13. 이전 1 2 3 다음
