ajax 요청 시 마우스 커서가 로딩표시로 바뀌도록 설정 //AJAX 통신 시작 $( document ).ajaxStart(function() { //마우스 커서를 로딩 중 커서로 변경 $('html').css("cursor", "wait"); }); //AJAX 통신 종료 $( document ).ajaxStop(function() { //마우스 커서를 원래대로 돌린다 $('html').css("cursor", "auto"); });
⚡ 클로저(closure) 클로저(closure)라는 개념은 내부 함수가 외부함수의 스코프(범위)에 접근할 수 있는 것을 말한다. 📝 예제 function outer() { var a = 'A'; var b = 'B'; function inner() { var a = 'AA'; console.log(b); } return inner; } var outerFunc = outer(); outerFunc(); // B 해당 코드에서 inner() 함수의 스코프가 outer()함수의 스코프를 참조하고 있고 outer()의 실행이 끝나고 소멸된 이후에도 inner() 함수가 outer() 함수의 스코프에 접근할 수 있는 것을 클로저라고 한다
자바스크립트는 동적언어이다. 타입은 프로그램이 처리되는 과정에서자동으로 파악한다. ⚡ let, const 사용하는 이유 ES6 이후로 var 대신 되도록 const, let을 사용해야 한다. 그 이유는 var의 변수 호이스팅과 function-level-scope로 생기는 문제 때문이다. 1. 호이스팅(Hoisting) 이란? console.log(puppy); var puppy ="cute"; console.log(puppy) //결과 undefined cute puppy변수를 아직 선언하지 않은 상태에서 호출했는데 오류가 나지 않고 undefined라는 값을 반환한다. 이런 현상을 "호이스팅"이라고 한다. 변수 호이스팅(Hoisting)은 변수의 선언과 초기화가 동시에 이루어져, 아직 값이 없음에도 ..
람다 1. 함수형 프로그래밍과 람다식 자바는 객체 지향 프로그래밍 : 기능을 수행하긴 위해서는 객체를 만들고 그 객체 내부에 멤버 변수를 선언하고 기능을 수행하는 메서드를 구현 함수의 구현과 호출만으로 프로그래밍이 수행되는 방식 함수형 프로그래밍(Functional Programming: FP) 함수형 프로그래밍은 순수함수(pure function)를 구현하고 호출함으로써 외부 자료에 부수적인 영향(side effect)를 주지 않도록 구현하는 방식입니다. 순수 함수란 매개변수만을 사용하여 만드는 함수 입니다. 즉, 함수 내부에서 함수 외부에 있는 변수를 사용하지 않아 함수가 수행되더라도 외부에는 영향을 주지 않습니다. 함수를 기반으로 하는 프로그래밍이고 입력받는 자료 이외에 외부 자료를 사용하지 않아 ..
컴파일(Compile)과 런타임(Runtime) 1) 컴파일(Compile)이란? 개발자가 프로그램을 위해 작성한 소스코드를 다른 프로그램이나 기계(H/W)가 처리하기 용이한 형태로 바꾸는 과정을 말한다. 컴파일 에러 컴파일 에러는 프로그램이 컴파일링되는 과정에서 발생하는 에러로 일반적으로 컴파일 에러 발생시 컴파일러는 문제를 일으킨 소스코드라인을 지적해준다. Syntax Error Type 체크 에러 파일 참조 오류 2) 런타임(Runtime)이란? 컴파일 과정을 마친 컴퓨터 프로그램이 실행되고 있는 환경 또는 동작되는 동안의 시간을 말한다. 런타임 에러 소스코드가 이미 실행가능한 프로그램으로 성공적으로 컴파일이 되었더라도 여전히 프로그램의 실행중에 버그를 일으킬 수 있다. 이렇게 프로그램의 실행중에 ..
equals()메서드 두 인스턴스의 주소 값을 비교하여 true/false 반환 인스턴스가 다르다라도 논리적으로 동일한 경우 true 반환하도록 재정의 할 수 있음 hashCode()메서드 hasCode()는 인스턴스의 저장 주소를 반환함 힙메모리에 인스턴스가 저장되는 방식이 hash 방식 hash: 정보를 저장, 검색하는 자료구조 자료의 특정 값(키 값)에 대한 저장 위치를 반환해주는 해시 함수를 사용 Student Lee = new Student(100, "kkk"); Student Lee2 = Lee; Student Shun = new Student(100, "kkk"); System.out.println("Lee.hashCode() - " + Lee.hashCode()); // 1784662007..
fetch 활용 수강생 명단 student-2.json [ { "name" : "도레미", "major" : "컴퓨터 공학", "grade" : 2 }, { "name" : "백두산", "major" : "철학과", "grade" : 1 }, { "name" : "홍길동", "major" : "국문학과", "grade" : 3 } ] JS fetch('student-2.json') .then(response => response.json()) .then(json => { let output= ""; json.forEach(student => { output += ` ${student.name} 전공: ${student.major} 학년: ${student.grade} `; }); document.quer..
Javascript만을 활용한 스타일 변경 예제 예제 title 클릭 시 글씨 변경 이미지 클릭 시 다른 이미지로 변경 My Profile 이름 : 도레미 주소 : somewhere 연락처 : 1234-5678 const title = document.querySelector("#title"); const pfImg = document.querySelector("#profile img"); title.onclick = () => (title.innerHTML = "프로필"); pfImg.onclick = () => (pfImg.src = "images/pf2.png");
프로미스란 콜백을 사용했을 때의 복잡함을 피하기 위해, ES6부터 "프로미스(promise)" 등장 프로미스는 객체를 생성(제작)하는 부분과소비하는 부분으로 나뉜다. 프로미스 제작 코드에서 '성공'과 '실패'를 확인한 후 소비 코드로 알려준다 프로미스 체이닝 then()을 사용해 여러 개의 프로미스를 연결하는 것을 '프로미스 체이닝' 이라고 한다. 프로미스는 resolve와 reject를 사용해서 성공과 실패에 대한 동작을 명확하게 구별할 수 있고, 함수에 계속해서 함수를 포함시키지 않기 때문에 콜백 지옥을 벗어날 수 있는 좋은 방법이다. 예) A,B,C 각 실행 시간이 다르지만 A작업이 끝날 때까지 기다렸다가 B작업을 하고, 다시 B작업이 끝날 때 까지 기다렸다가 C작업을 해아 한다면? 프로미스 체이닝..
Date 함수 활용 let now = new Date(); let year = now.getFullYear(); let month = now.getMonth() + 1; let day = now.getDate(); console.log('now =', now); // Date Sun Mar 12 2023 20:59:40 GMT+0900 (대한민국 표준시) console.log(year); // 2023 console.log(month); // 3 console.log(day); // 12 예제) 'yyyy-mm-dd' 형태로 출력 let nowDate = year + '-' + month.toString().padStart(2,0) + '-' + day.toString().padStart(2,0); //..
| SFTP를 활용한 파일 업로드 📝 설정 SFTP를 사용하기 위해서는 Jsch dependency를 추가해줘야 한다. com.jcraft jsch 0.1.55 💻 코드 package e3ps.common.util; import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundException; import java.io.IOException; import java.util.Properties; import java.util.Vector; import org.apache.commons.net.ftp.FTPClient; import com.jcraft.jsch.Channel; import com.jcraft.jsch.Chan..
💻 MDN Web DOC https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match String.prototype.match() - JavaScript | MDN The match() method retrieves the result of matching a string against a regular expression. developer.mozilla.org 💻 특정 문자 포함여부 체크 var telValue = $('#tel').val(); if ( telValue.match("-")) { alert('-을 제거해주세요.'); return false; }