라벨이 자바스크립트인 게시물 표시

(자바스크립트) EventDelegation(여러개의 탭 쉽게..)closest(),

Event Delegate :  Child Element들 각각에 Event Handler를 추가하는 것이 아니라 Parent Element에 Event Handler를 추가한 뒤 Event가 발생한 node를 확인하여 처리하는 방법. 장점 : 등록되는 Event Handler의 수를 줄일 수 있다. (성능에 도움이 된다.) 코드가 간결해지며 유지보수가 수월해진다. 단점 : 불필요한 Event를 filtering하는 작업이 추가된다. 참고: https://davidwalsh.name/event-delegate 참고:http://regularmotion.kr/javascript-patterns-event-delegate/ * closest()는 가장 가까운 li를 찾아줌. 즉, 가장가까운 자식을 찾아줌.

(Redis) 레디스 데이터구조와 명령어 사용2

1. 해시데이터 1) hmset 명령은 주어진 필드와 값의 쌍을 해시 데이터에 저장한다. 즉, 주어진 모든 키와 값들을 저장하는데, 인자로 입력되는 필드와 값의 쌍은 다중입력이 가능하다. 2) hsetnx 주어진 필드가 존재하지 않을 떄 저장한다. 만약 주어진 필드가 존재한다면 값은 저장되지 않는다. 3) hmget 주어진 필드 목록을 주어진 키에서 조회한다. 4) hlen 주어진 키에 저장된 필드의 개수를 조회한다. 주어진 키의 데이터형이 해시가 아니면 오류를 돌려준다. 4) hdel 주어진 키에 저장된 필드를 제거한다. <숫자의 증감>  해시에 저장된 데이터의 필드값이 숫자일 때 hincrby, hincrbyfloat 명령으로 증감처리를 할 수 있다. 문자열 데이터에서 지원하는 숫자 증감 명령들과는 다르게 해시명령은 증가 명령만 을 지원한다. 숫자의 감소를 처리하기 위해서는 명령의 인자에 음수를 입력하면 된다. 1) hincrby 주어진 키에 저장된 필드에 숫자 증감처리를 한다. 만약 주어진 키가 존재하지 않으면 새로운 해시데이터를 생성한다. 2) hincrbyfloat 주어진 키에 저장된 필드에 숫자 증감처리를 한다. 단, 지정값은 배정밀도 flaot값이어야 하며, 소수점은 17자리로 고정되어 있다. <해시데이터의 키 목록 조회> 해시데이터 저장된 모든 키의목록과 모든 값의 목록을 조회할 때는 hgetall을 사용하면 된다. 키의 목록이나 값의 목록만을 조회하는 명령은 hkeys, hvals다. 2. 셋 데이터 <정렬된 셋 데이터> * 가중치 변경 1) zincrby 주어진 키에 저장된 셋 데이터 중 지정된 요소의 가중치를 입력된 값만큼 증가시킨다. 2) zrank 주어진 키에 저장된 셋 데이터 중 지정된 지정된 요소의 순위를 조회한다. 조회되는 순위는 0부터 시작하며, 정렬은 가중치 오름차순이다. 예를들어, 5개...

(자바스크립트) 클로저

클로저란? 참조하는 환경을 갖고있는 함수

(자바스크립트) 함수범위

function whereAreYou(){    var justAVar="그저 일반적인 지역변수입니다.";      function inner(){        return justAVar;    }   return inner; } var innerFunction=whereAreYou(); var result=innerFunction(); console.log( result ); 설명: 먼저 whereAreYou() 함수를 호출합니다. 이 함수는 함수 참조를 반환하므로 innerFunction변수를 선언해 반환된 함수 참조를 할당합니다. 이때 함수 참조가 환경에 연결되어 있다는 점에 주의, 여기서 환경이란 지역변수 justAVar이 저장된것을 말한다. 이제 innerFunction()를 호출한다. 함수를 호출하면 함수 본체가 실행되는데, 이때 다음과 같이 함수와 연결된 환경에서 실행된다.

(자바스크립트) 함수 내포와 범위

var migrating=true; var fly=function(num){    var sound="훨훨";    function wingFlapper(){      console.log(sound);    }    for (var i=0; i<num; i++){     wingFlapper();    } }; function quack(num){     var sound="꽥";     var quacker= function(){       console.log(sound);     };   for( var i=0; i<num; i++){     quacker();   } } if(migrating){   quack(4);   fly(4); } 설명: 코드의 최상위에서 정의된 것은 모두 전역범위이다.. 그러므로 fly와 quack는 전역변수가 된다. 그렇지만 fly함수는 함수 표현식을 평가한 후에 정의된다는것 점에 주의해야 한다. wingFlapper()함수는 fly()함수 안에서 함수 선언으로 정의되어 있으므로 범위가 fly()함수 내부로 한정된다. 따라서 fly()함수 본체 어디에서든 wingFlapper()를 사용할 수 있다. quacker()는 quack()함수 안에서 함수 표현식으로 정의되어 있으므로 범위가 quack()함수 내부이다. 그렇지만 함수 표현식을 평가한 후에 정의되므로, 정의된 후에야 사용할 수 있다.

(자바스크립트) 함수는 언제 정의되는가?

var migrating=true; if(migration){   quack(4);   fly(4); } var fly=function(num){    for(var i=0; i<num; i++){       console.log("훨훨~");    } }; function quack(num){    for(var i=0; i < num ; i++){        console.log("꽥");    } } 설명: quack함수는 실행되지만 fly는 실행되지 않는다. 그 이유는 함수 선언은 코드의 꼭대기, 바닥, 중간, 어디에나 놓고 어디에서나 호출할 수 있다. 함수 선언은 코드 어디에서 정의되어 있든 함수를 생성한다. 이것을 호이스팅(Hoisting) 라고 한다. 하지만 함수 표현식은 평가되기 전까지는 함수가 정의되지 않으므로 분명히다르다. 따라서 위에서 구현한 것처럼 함수 표현식을 전역 변수에 할당하더라도 함수표현식이 실행되기 전까지는 호출할 수 없다. 위 예제코드에서는 두 함수가 모두 전역범위에 있다. 즉, 일단 정의만 되면 코드 어디에서든 볼 수 있다는 것이다. 그렇지만 내포된 함수(Nested Function)도 고려해야 한다. 내포된 함수는 다른 함수 안에 정의된 함수를 말한다. 내포된 함수는 호출할 수 있는 범위가 제한되어 있다.

(자바스크립트) 익명함수

*익명함수는 그저 이름 갖고 있지 않은 함수로써 함수참조를 사용하는 곳에 사용할 수 있다. function handler(){ alert("아싸! 페이지 로딩완료!"); }; window.onload=handler; 이것을 다음과 같이 고칠 수 있다. windows.onload=function(){ alert("아싸 페이지로딩완료"); }; 또 다른 예제) function cookieAlarm(){    alert("쿠키를 오븐에서 꺼낼 시간입니다."); }; setTimeout(cookieAlerm,600000); 이것을 다음과 같이 고칠 수 있다. setTimeout(function(){ alert("쿠키를 오븐에서 꺼낼 시간입니다."); , 60000); *어떤 코드가 함수 참조를 기다리고 있다면 그 자리에 언제든 함수 표현식을 사용할 수 있습니다.