본문 바로가기

Javascript19

Prototype(프로토 타입) Prototype 프로토타입 자바스크립트에서 프로토 타입은 두 가지의 의미를 혼용해서 사용한다. 프로토타입의 두가지 의미 __proto__ : 상위에서 물려 받은 객체의 프로토타입에 대한 정보 prototype : 자신의 프로토타입 객체 즉, 하위로 물려줄 프로토타입의 정보 예시 정의한 Animal 함수의 __ proto __ 는 Amimal 객체를 생성할 때 사용될 원형프로토타입을 가르키고 있다. Animal 함수의 prototype은 Animal의 Prototype가르키고 있다. (두 가지 의미중 두 번째 ) 예시 2 생성한 cat 객체와 dog 객체의 __proto__(prototype link)은, cat 객체와 dog 객체를 생성한 프로토타입 객체를 가르키고 있습니다. 프로토타입 체인(Proto.. 2021. 6. 1.
[JavaScript]Form Data란? FromData란 ajax로 폼 전송을 가능하게 해주는 FormData 객체입니다. 보통은 Ajax로 폼(form 태그) 전송을 할 일이 거의 없습니다. 주로 JSON 구조로 "KEY-VALUE" (키와 값) 구조로 데이터를 전송합니다. 하지만, form전송이 필요한 경우가 있는데, 이미지를 ajax로 업로드할 때 필요합니다. 이미지는 base64, buffer, 2진 data 형식으로 서버로 전송해도 됩니다. 하지만 추천 드리는 방법은 input[type=file]을 사용해 form(폼)을 통해서 업로드를 하는 것 입니다. 보통, form을 제출하면 action 속성에 의해 지정한 페이지로 이동하면서 데이터를 전송합니다. ajax는 반대로 제출 버튼을 누르면 기본 폼 동작은 e.preventDefaul.. 2020. 9. 27.
$.ajax(에이젝스) 비동기식 처리와 동기식 처리 async | AJAX로 할 수 있는 것 AJAX라는 네트워크 기술을 이용하여 client - > Server로 Data 요청하고 그에 대한 결과를 돌려받을 수 있다. AJAX는 HTML 페이지 전체가 아닌 일부분만 갱신할 수 있도록 XMLHttpRequest 객체를 통해 서버에 request한다. 이 경우,JSON이나 XML형태로 필요한 데이터만 받아 갱신하기 때문에 그 만큼의 자원과 시간을 아낄 수 있다. Client란? -Server에서 정보를 가져와서 사용자에게 보여줄 수 있고 사용자와 상호작용할 수 있는 소프트웨어를 일컫음 ex)web browser, 핸드폰 어플리케이션 Server란? - 네트워크 상에서 접근할 수 있는 프로그램으로서 어떤 자료들에 대한 관리나 접근을 제어해주는 프로그램 (일반적으로 사용.. 2020. 7. 26.
[jQuery]map()과reduce()란 무엇일까? 실무에서 하드 코딩을 하다가 배열 안에서 중복되는 값들을 count 해야 하는 상황이 왔다. 찾아보니 reduce()라는 기능을 가진 녀석이 있었는데 글을 적으며 이해하기 위해 노력해본다. ex) arr = {"김동수","김동수","김영희","김영희"} 라는 녀석이 있는데 중복 값을 count 해야 한다. 얼핏 정리한 글들을 봤는데 자바스크립트 내장 메서드 중에서 제일 강력하다는 글을 보았다. 먼저 map()을 살펴보자. map()이란? map의 기본 원리는 간단한데, 반복문을 돌며 배열 안의 요소들을 1:1로 짝지어 주는 것이다. 어떻게 짝지어줄 것인가 정의한 함수를 메서드의 인자로 넣어주면 된다. // map 활용 const arr = [1,2,3]; let result = arr.map( (resu.. 2020. 7. 16.
[JQuery] each()란? jQuery를 사용해 배열을 관리하고자 할 때 each() 메서드를 사용할 수 있습니다. each() 메서드는 매개 변수로 받은 것을 사용해 for in 반복문과 같이 배열이나 객체의 요소를 검사할 수 있는 메서드입니다. each() 메서드는 다음과 같은 두 가지 타입이 있습니다. // jQuery 유틸리티 메서드 $.each(object, function(index, item){ }); // jQuery 일반 메서드 $(selector).each(function(index, item){ }) 간략한 설명을 드리겠습니다. $(selector).each(function(index, element)) $('li').each 셀렉터는 앞에 알맞게 본인이 원하는걸 선택하면 되겠습니다. function 반복문 한.. 2020. 3. 19.
[JavaScript]Callback의 역할 콜백함수란? 콜백 함수는 함수 안에서 어떤 특정한 시점에 호출되는 함수를 말합니다. 콜백 함수는 함수의 매개변수로 전달하여 특정 시점에서 콜백 함수를 호출합니다. 함수정의 // 콜백 함수가 될 매개변수 설정 function plus(a, b, callback) { var sum = a + b; callback(sum); } plus 함수를 보면 callback라는 매개변수를 넣어주고 plus 함수 내부에서 callback 매개변수를 함수 형태로 실행하고 있는 모습입니다. 정의한 함수 호출 // plus 함수에 익명 함수를 인자로 전달 plus(1, 2, function(result) { console.log(result); }); 익명 함수를 전달하고 plus 함수를 호출하고 있는 모습입니다. 함수에서 .. 2020. 3. 12.