목록Knowledge Wiki/Javascript (51)
KorSA
1. 전역변수 함수나 변수를 전역공간에서 만들면 {window}에 보관함 {window}는 전역변수 그래서 전역으로 정의한 func()를 호출할 때 window.func()도 동일하게 동작함..!! function func(){ console.log(this); } // 둘 다 동일한 동작 func(); window.func();
1. ES6 함수 신 문법 Arrow Function 특징 : 1) 형식 : () => {} 2) 기존 function과 달리 this를 따로 재정의하지 않아서 함수 밖에 있는 this를 그대로 따름
1. strict 모드 script문의 시작에 'use strict' 를 쓰면 strict mode로 동작함 -> IE10 이상에서 작동
1.this의 의미 1) 그냥 쓰거나 일반 함수 안에서 쓰면 {window}를 의미함 {window} 오브젝트는 자바스크립트 기본 함수들을 가지고 있는 변수임 2) strict 모드에서는 일반 함수 안의 this가 undefined됨 3) 오브젝트 내 함수 안에서 this는 오브젝트를 의미함 자바스크립트는 오브젝트 안에 함수 넣을 수 있음 오브젝트 안의 함수에서 this를 쓰면 이 this는 자신을 포함하고 있는 오브젝트를 의미함 4) 이벤트리스너 안에서는 e.currentTarget을 의미함 2. 오브젝트 내에서 콜백 함수를 사용하면 이 함수 내부에서 this는 {window}를 의미한다. 콜백 함수 자체는 전역으로 정의가 되었기 때문. 만일 콜백 함수를 Arrow Function 형태로 바꾸면 thi..
1. JavaScript 버전 역사 2009: ES5 2015: ES6 (대규모 업데이트) 2016: ES7
1. 터치 이벤트 등을 구현하기 좋은 라이브러리 - Hammer.js 호환성 걱정 X var mng = new Hammer.Manager(img1); mng.add(new Hammer.Pan({threshold: 0})); // threshold: 이벤트 작동 역치(최소값) mng.on('pan', function () { console.log(e.deltaX + ' ' + e.deltaY); }); 2. pan 동작 후 사용자가 마우스를 놓는 순간은 e.isFinal로 캐치 if (e.isFinal) { $('.slide-container').cs('transform', 'translateX(-100vw)'); }
1. AJAX 서버에 데이터를 요청해서 받아오는데 새로고침 없이 받아오기. 새로고침없이 서버에 GET/POST 요청가능. 2. AJAX는 세부 기능들이 많아서 그때그때 필요한 거 찾아쓰면 됨 done() 말고도 always(), fail() 등도 있음. 로딩 화면은 always() 쓰면 좋음
1. DOM (Document Object Model) JavaScript가 HTML 쌩문법을 아는게 아니기 때문에 HTML 정보를 Object화하여 다루어야 한다. 그게 DOM임. 2. HTML 코드가 나오기 전 JavaScript 코드가 HTML 태그를 찾으려하면 오류가 발생한다. JavaScript 입장에서는 아직 DOM이 완성되어있지 않기 때문. 3. jQuery ready() 이벤트리스너 8과 같은 에러가 날 때 사용하면 좋은 함수. ready() 이벤트 리스너는 "HTML을 다 읽어들였는지" 알려준다. HTML을 다 읽고 난 후 구동시켜야되는 자바스크립트 코드들은 여기 적으면 된다. // jQuery 문법 $(document).ready(function(){ // DOM 생성 완료 후 작업 }..
1. 자바스크립트 소수점 반올림하기 var myNumber = 99.987; myNumber.toFixed(0); // 100 myNumber.toFixed(3); // 99.987
1. 어레이 sort() 함수 기본 사용법 arr.sort(function(a, b){ return a - b; }); 2. 어레이 filter()함수 기본 사용법 filter()함수는 리턴되는 새 변수를 사용해야 한다. 기존꺼는 데이터가 안바뀜. var newArr = arr.filter(function(a){ return a < 4; }); 3. 어레이 map() 함수 기본 사용법 map()함수는 리턴되는 새 변수를 사용해야 한다. 기존꺼는 데이터가 안바뀜. var newArr = arr.map(function(a){ return a * 2; }); 4. 어레이 복사할 때는 그냥 대입하면 안된다 var arr = [1,2,3]; var newArr = [...arr]; // 이렇게 해야 어레이 값들이..