변수형태 함수 vs 함수 a(); var a = function() { }; - 실행 불가 (a is not a function * a는 함수로 사용이 가능하지만 본질은 변수이기 때문에 선언 이후에 사용을 해야한다 a(); function a() {} - 실행 가능 * a는 함수로 선언이 됬기 때문에 어디서든 호출이 가능하다 Frontend/JavaScrpit 2021.04.06
Submit() 으로 데이터를 전달하는 방법은 2가지가 있다 첫번째 방법 (, 활용) 1. 에 action을 지정 2. [type='submit']에 inline으로 onclick = "return 함수();" 지정 *함수()의 결과를 true 또는 false로 받고 true면 submit 실행, false면 아무 행동도 하지 않고 현재 페이지에 머뭄 3. onclick에서 true를 리턴하면 이 결과를 이 가지고 action에 지정된 url로 이동 두번째 방법 (를 쓰지 않고 submit() 함수 활용) 1. 에 action, method 지정하지 않고 대신 id값을 지정 2. [type='submit'] 대신 [type='button']을 지정 3. [type='button']에 onclick = "return 함수.. Frontend/JavaScrpit 2021.04.02
Modal, @Keyframs modal element가 의 상단에 있으면 먼저 공간을 점유해서 다른 element들에게 영향을 주기 때문에 일반적으로 끝에 위치시킨다 modal 위에서 content가 동작하기 때문에 가장 밑에 있으면 다른 element에 끼어서 움직이지 않는다 그러므로 content는 z-index를 통해 가장 위에 위치시켜야하고 나머지 element는 그 아래 위치한다 Frontend/JavaScrpit 2021.04.02
Inline 형태 호출 자바스크립트 함수를 inline에서 호출을 하면 onload 또는 jQuery의 ready 안의 함수에는 접근이 불가하다 inline 호출 함수에서 매개변수를 주지 않으면 내에서 this는 window를 가리키기 때문에 두가지 방식으로 사용할 수 있다 1. this.event.target을 이용해 window에 발생한 event를 타겟해서 사용 2. 매개변수를 주어 this에 element를 담아 보내준다 Frontend/JavaScrpit 2021.03.31
window.addEventListener() window는 페이지 전지역을 가리킨다 즉 window.addEventListener는 페이지 전체에서 이벤트가 발생했을 때 () 안의 명령을 실행시킨다 이 때문에 가 안에 있다면 필수적으로 명시해 안에 있는 객체에 접근할 수 있도록 해야한다 *또는 에 다이렉트로 명시도 가능 window.addEventListener에 페이지를 로드했을 때 실행이 되는 함수를 등록해놓고 그 안에 원하는 이벤트 핸들러를 등록해야 페이지 안의 모든 변수, 객체들에 접근이 가능하다 페이지를 로드하는 핸들러 페이지 로드 함수() { 버튼의 아이디를 받아와 변수와 버튼을 연결 버튼을 가리키는 핸들러 생성 } 버튼 함수() { 버튼 벨류 변경 명령어 } Frontend/JavaScrpit 2021.03.25
Event handler -을 getElementById, querySelector로 선택해 변수 btn에 담아놓은 상황을 가정한다 -자바스크립트는 내부에 위 사진과 같은 이벤트 핸들러 함수들을 가지고 있고 이벤트에 등록해 놓은 함수의 파라미터에 뿌려준다 *파라미터에 이벤트 핸들러 함수 전체가 들어 있기 때문에 모두 사용 가능하다 ex) 파라미터.target을 a라는 변수에 담고 alert(a.id);를 실행하면 id 값 btn이 출력된다 유저는 위 사진의 함수가 동작하는 상황이 발생했을 때 2가지 방법으로 유저가 지정한 함수를 실행하도록 할 수 있다 1. btn.addEventListener("이벤트 핸들러 함수", 실행하고 싶은 유저 함수); *지정한 변수에 이벤트 핸들러 함수가 동작했을 때 실행하고 싶은 유저 함수를 실행하.. Frontend/JavaScrpit 2021.03.24
Function function f1(e1, e2, e3) { v3 = e1+e2+e3 return v3} *매개변수를 모두 더해 v3라는 변수에 담고 그 값을 리턴하는 함수 var v1 = f1; v1(10, 20, 30); f1(10, 20, 30); *f1함수를 v1에 담으면 v1을 f1함수처럼 사용할 수 있다 functionf2() { return f1; ) *f1 함수를 리턴하는 함수 function() f3 { f3_1() { } return f3; } *f3_1 함수를 내부에서 정의한 후 그 값을 리턴하는 함수 Frontend/JavaScrpit 2021.03.24
배열, 객체 생성 배열 생성 1. let a = new Array(3); a[0] = "a"; a[1] = "b"; a[2] = "c"; 2. let a = new Array ("a", "b", "c"); 3. let a = ["a", "b", "c"]; 4. let a = []; a.push("a"); a[3] = "b"; a.pop(); 객체 생성 var a = { att1: "값1", att2: "값2"}; Frontend/JavaScrpit 2021.03.23
NaN 1.Number cannot be parsed (e.g. parseInt("blabla") or Number(undefined)) 예시) 숫자를 파싱 (분석) 할 수 없는 경우 문자를 숫자로 형변환 2. Math operation where the result is not a real number (e.g. Math.sqrt(-1)) 계산 결과가 숫자가 아닌 경우 예시) 음수의 제곱근 *음수의 제곱근은 허수1.Number cannot be parsed (e.g. parseInt("blabla") or Number(undefined)) 예시) 숫자를 파싱 (분석) 할 수 없음 문자를 숫자로 형변환 2. Math operation where the result is not a real number (e.g... Frontend/JavaScrpit 2021.03.23
자바스크립트 데이터타입타입 null 값이 들어가 있거나 존재하지 않는 변수를 호출 = null / object 변수 선언이 없거나 초기화 되지 않음 = undefined false로 치환되는 5가지 undefined null 0 "" NaN Frontend/JavaScrpit 2021.03.22