본문 바로가기

분류 전체보기

(153)
[자바스크립트] -함수 표현식 > 익명함수, 즉시실행함수 함수표현식 일반 함수 정의문의 경우 함수명을 선언하고 그 이름을 사용해서 호출한다. 이 방법은 함수 이름만 알고 있으면 어디서나 함수를 실행할 수 있어서 많이 사용한다.  이 밖에 함수 이름을 지정하지 않고 사용하거나, 함수를 호출하지 않고 바로 실행하는 함수도 있다.함수 중 1. 익명함수나 2. 즉시실행함수를 모두 함수 표현식이라고 한다. 1. 익명함수  익명함수는 이름이 없는 함수를 말한다. 익명함수를 선언할 때에는 이름을 붙이지 않는다.  변수에 넣어 사용하기 때문에 익명함수를 호출할 때에는 변수명을 이용해 호출할 수 있다.  일회용 기능들을 익명함수로 많이 쓴다.  호이스팅 X  재사용 O [기본형]let 변수명 = function(){ 자바스크립트 코드;} 변수명();   ..
[자바스크립트]- 함수의 호이스팅 / 스코프(함수의 유효범위) 일반함수의 호이스팅 일반 함수 정의문(=이름이 있는 함수)의 경우 호이스팅 기능을 지원한다.  함수의 호이스팅은 함수 정의문보다 함수 호출문이 먼저 등장하더라도 해당 함수를 정상적으로 실행하는 것을 말한다.  일반 함수가 정의되면 자바스크립트 엔진 메모리 공간 안에 함수의 이름을 이용해 미리 저장해둔다.  저장된 일반 함수는 해당 함수보다 호출문이 먼저 등장하더라도 호이스팅에 의해 정상 실행이 된다.  하지만 익명함수 즉, 이름이 없는 함수의 경우 호이스팅 기능이 적용되지 않는다.  그렇기 때문에 함수정의가 먼저 이루어진 다음 그 후에 함수 호출문이 등장해야 함수가 실행된다.  기계보다 버튼이 먼저 눌러지더라도 기계가 정상 작동된다. 함수들을 한꺼번에 모아서 맨 위나 아래에 모아놓고 호이스팅 기능으로 버..
[자바스크립트] - 재귀 함수 호출 재귀 함수 호출 함수 정의문 내에서 작성한 코드로 함수를 다시 호출하는 것을 재귀 함수 호출이라고 한다.  재귀 함수 호출은 반복문처럼 여러 번 호출하기 위해 사용한다.  [기본형] function 함수명(){ 자바스크립트 코드; 함수명();   let num = 0;      function testFnc() {        num++;        document.write(num, "");        if (num == 10) return; //num이 10이 되면 함수 종료. 10이 되기 전까진 if문이 실행되지 않는다.        testFnc(); //바깥에 함수 호출문이 실행되면 안족의 함수 호출을 실행      }      testFnc(); ..
[자바스크립트] - 자바스크립트에서 html 접근하기 / .setAttribute( )매서드 / 선택한 태그의 특정 속성을 수정 .setAttribute( )매서드: 선택한 태그의 특정 속성을 수정하는 매서드 .setAttribute( )매서드의 첫번째 인자값으로는 해당 태그의 속성 이름이 들어가고, 두번재 인자값으로는 해당 속성의 바꾸려는 값을 전달한다.인자끼리는 , 로 구분한다.   [기본형]선택한 태그.setAttribute('태그의 바꾸려고 하는 속성이름', '바꿀 속성 값'); const imgTag = document.getElementById("photo");imgTag.setAttribute("src", "./img/pic_" + num + ".jpg");태그를 선택할 때는 .getElementById를 쓰거나 등등으로 선택.
[자바스크립트] - return 함수의 값을 반환하는 return문  return문은 함수에서 결과값을 반환할 때 사용한다.  그리고 return문이 실행되면 반복문의 break문처럼 코드가 강제 종료된다.  즉 return문 아래에 코드가 더 있더라도 return문을 만나면 아랫줄의 코드는 무시하고 값을 반환한 후 코드를 종료하게 된다.       ☆ 반환된 값은 함수를 호출한 자리에 남는다. 그렇기 때문에 함수호출문이 변수 안에 담겨 있어야 한다.   [기본형]function 함수명(){ return 반환할 값;}let 변수 = 함수명(); retrun문 아래에 자바스크립트 코드가 등장하면 실행되지 않는다.  retrun문 위에 자바스크립트 코드가 있으면 가능하다. [기본형 2]function 함수명(){ 자바스크립트 코..
[자바스크립트]- ★매개변수 / 매개변수 없이 인수 값 받아오기 arguments 매개변수가 있는 함수 정의문 기본 함수 정의문은 함수 안에 있는 코드를 실행할 때 단순히 함수명으로 호출해서 함수를 실행했다. 즉, 함수를 호출할 때 값을 전달할 수 없었다.  하지만 매개변수가 있는 함수 정의문은 함수를 호출하고자 할 때 전달하려는 값을 인수로 넣어 전달할 수 있다.  이렇게 전달된 값은 매개변수가 받아 함수 정의문에서 사용할 수 있다.  매개변수에 함수호출문에 있는 인수가 순서대로 할당된다.    매개변수 = 파라미터 라고 하기도 한다.  [기본형] 1. 매개변수의 갯수와 인수의 갯수가 일치하는 경우 function 함수명(매개변수1, 매개변수2, 매개변수3..){ 자바스크립트 코드;}함수명(인수1, 인수2, 인수3..); 호출할때 인수를 넣어준다.  function addNu..
[자바스크립트] 자바스크립트에서 css 접근하기 getElementById 자바스크립트에서 id선택자 선택하기 자바스크립트에서 html에 있는 태그 중 id 속성이 있는 태그를 선택하고 싶을 때 사용한다.  getElementById는 이름에서 알 수 있듯이 이미 id선택자임을 지칭하고 있기 때문에 메서드의 소괄호 안에 #은 붙이지 않는다. 순수하게 이름만 들어간다.  [기본형] document.getElementById("아이디이름") *아이디이름은 문자열로 들어가야한다. 문자열로 들어가지않으면 변수로 취급한다.  ex) the_body "> -> document.getElementById(" the_body ") 자바스크립트로 css에 특정 속성을 제어하고 싶다면 먼저 css로 접근을 해야한다. 접근하는 방법은 document객체에 포함되어 있는 .style 속성을 사용하는..
[자바스크립트] - 자바스크립트에서 변수 쓰는 법 자바스크립트는 유연해서 편리한 언어이다. 이렇게 써도 저렇게 써도 자유롭게 문장을 구성할 수 있는 언어이다. 하지만 이런 편리성은 프로그램이 커지면 가독성이나 디버깅을 하기 어렵게 만든다. 자바스크립트 문법은 벗어나지 않으면서 가독성과 디버깅을 하기 쉽도록 변수를 사용할 때에는 아래와 같이 사용해야한다.  1. 전역변수는 최소한으로 사용한다. 전역변수는 프로그램 어디든 접근할 수 있으므로 편리하게 사용할 수 있다. 하지만 예상하지 못한 곳에서 오류가 발생할 확률이 높다. 그래서 되도록이면 전역변수는 최소한으로 사용하는 것이 좋다.  2. var 변수는 함수의 시작부분에서 선언한다. var를 이용한 변수는 어디에서 선언하든 상관없지만 내부에서 호이스팅이 생기기때문에 오류가 발생할 확률이 높다. 그래서 va..
[자바스크립트] - 변수 const const   재할당재선언 XX  const역시 let이나 var와 마찬가지로 변수를 만드는 키워드이다. 이름에서 알 수 있듯이 const로 선언한 변수는 '상수변수'(constant variable)이다. 상수는 프로그램 안에서 변하지 않는 값을 뜻한다. 즉, 변하면 안되는 값을 변수로 선언할 때 const를 사용한다. 프로그램에서 특정 상숫값을 자주 사용한다면 변수에 담아서 사용하는 것이 편리하다. const로 선언한 변수는 값을 재할당하거나, 이름을 재선언할 수 없으며let을 사용한 변수처럼 블록레벨의 스코프를 가진다.(선언된 중괄호 안에서만 유효하다)*선언할때 값도 같이 넣어놔줘야한다.*회원가입정보를 넣어놓거나 태그를 선택해서 넣어놓을 때등 사용한다. 비주얼스튜디오에서는 오류가 안나지만 콘솔창에서..
[자바스크립트] - 변수의 재선언 / 재할당 변수의 재선언과 재할당 재선언 = 같은 이름의 변수를 var에 붙여 여러 번 선언. var name = Lee; 해놓고 다시 var name = Park; 이라고 하면 재선언재할당 = 만들어진 변수에 값을 여러 번 집어넣는 것.  var num1 = 10; 해놓고 num1 = 30; 이라고 하면 재할당         var num1 = 10; //num1이 선언됨var num1 = 20; //num1을 재선언함 그릇을 깨고 다시 재선언num1 = 30; //재할당. 변수에 새로운 값을 넣어서 재할당. 그릇은 나두고 값만 다시 바꾸기