본문 바로가기

전체 글

(119)
[javascript 언어공부] 배열(3) 이번에는 배열을 제어하는 방법에 대해서 알아보자. 우리는 배열에 담겨있는 데이터를 추가,삭제하거나 어딘가에 낑겨 넣거나 하는 작업을 할 필요가 있다. 먼저 추가에 대해서 알아보자. var li = ['a', 'b', 'c', 'd', 'e']; 다음과 같은 배열이 있다. 이 배열에 .push('f'); 라는 명령을 해보면li.push('f'); 배열을 호출했을 때 alert(li); var li = ['a', 'b', 'c', 'd', 'e','f'];기존에 볼 수 없었던 'f'라는 원소가 배열 뒤에 추가되었음을 알 수 있다. push라는 함수가 있다. 이 함수는 자바스크립트가 기본적으로 제공하는 내장함수이다.이 함수를 호출할 때 첫번째 인자로 'f'라는 값을 전달했더니, f라는 값을 push라는 함수가..
[javascript 언어공부] 배열(2) 이번에는 배열을 사용하는 좀 더 구체적인 방법에 대해서 살펴보자. 배열에 대해 어떤 값을 가져올 때, index값을 기억하고 있는 것은 불가능하다.따라서 배열이라는 것은, 배열에 담겨 있는 값들을 하나하나 꺼내서, 꺼내진 값들을 가공하는 것이 배열을 사용하는 것의 핵심이다. '하나하나 꺼내온다'는 것은 앞서 배운 것 중 '반복문'과 연관된다. 배열은 반복문과 함께 사용했을 때 비로소 그 가치가 발휘된다. 하단의 코드를 보자. function get_members(){ return ['estelar', 'yesri', 'hongjoo'];} var members = get_members(); get_members()라는 함수를 정의하고, 그 함수를 호출한 결과를 members 라는 변수에 담는다. 과연 이..
[javascript 언어공부] 배열(1) 이번시간에는 배열에 대해서 배워보자. 배열(array)은 연관돼있는 데이터들을 모아서 통으로 관리하기 위해 사용하는 데이터 타입(형식)이다.다시말해서 배열은 데이터를 담는 그릇이다. 이전에 배운 데이터를 담는 그릇은 변수이며, a라는 변수에는 1이라는 값이 들어갈 수도, 2라는 값이 들어갈 수도 있으나변수 안에 들어가는 것은 하나의 값이었다. 배열은 데이터를 담는 여러개의 붙어있는 그릇이며, 하나의 데이터에 여러개의 데이터를 저장할 수 있고 꺼내올수도 있다. 먼저 배열을 만들어보자.배열은 대괄호로 시작해 대괄호로 끝나야 하며, 그 안에 서로 연관돼있는 데이터를 넣는다. 만약 회사에 3명에 직원이 있고, 그 구성원들을 이름을 배열에 담는다고 생각해보자. var member = ['estelar','yesr..
[javascript 언어공부] 함수(2) 이번시간에는 함수의 입력과 출력에 대해서 알아보자. 프로그래밍에서의 함수는 어떻게 입력을 받고, 어떻게 출력을 받을까? 먼저 출력에 대해서 알아보자. 출력은 return이라는 키워드를 사용한다.하단의 예제 코드르 보자. function get_member1(){ return 'estelar';} function get_member2(){ return 'hongjoo';} alert(get_member1());alert(get_member2()); 하나는 get_member1이라는 함수이고, 하나는 get_member2라는 함수이다.그리고 함수 내부에는return이란는 키워드가 있다. 함수 내부를 읽던 컴퓨터는 return을 읽으면 함수를 종료시킨다.그리고 return 뒤에 있는 값을 함수 바깥쪽으로 뱉어..
[javascript 언어공부] 함수(1) 이번시간에는 함수에 대해서 배워보자.함수는 영어로 function이다. 프로그래밍에서의 함수는 수학에서의 함수와 똑같은 개념이다.하지만 수학에서의 함수와 프로그래밍에서의 함수는 개념은 같지만 중요시 여기는 부분은 다르다. 프로그래밍에서 함수의 가장 중요한 역할은,하나의 로직을 재실행 할 수 있도록 하는 것으로 코드의 재사용성을 높여준다는 것이다. 재사용성이란 자신이 작성한 코드를 여러 맥락에서 다시 사용할 수 있도록 하는 것이다. 하나의 코드를 여기 저기서 사용할 수 있게 된다는 것의 이점은코드를 작성하는 시간이 줄어드는 것이고, 코어 코드가 개선되면, 이것을 사용하는 모든 코드가 개선된다는 좋은 점이 있다. 따라서 함수를 공부하며 가장 주목할 것은 재사용성이며,이 재사용성이 어떻게 달성되는가에 대해서 ..
[javascript 언어공부] 반복문(3) 이번에는 반복문의 효용에 대해서 알아보자. 어떤 것을 공부할때, 공부만 하는 것은 재미 없을 수 있다.'이게 없다면 얼마나 불편할까?' 라고 생각해 보는 것도 중요하다. 이것이 없었던 시절에 살았던 사람이라고 상상해보고 그 기능이 없었을 때 얼마나 불행했을까,그리고 그 기능이 처음 개발했을 때 사람들이 얼마나 기뻐했을까라는 것에 대해 공감해보면 좋을 것이다. 다음과 같은 코드를 작성 후 실행해보면 document.write('coding everybody'); 브라우저엔 coding everybody가 출력될 것이다. 누군가가 이것을 10줄 출력하라고 한다면, document.write('coding everybody ');document.write('coding everybody ');document...
[javascript 언어공부] 반복문(2) - for문 이번시간에는 while문과 함께, 아주 잘 사용되는 또다른 문법에 대해서 살펴보겠다. 우선 저번시간에 배운 while에 대해 다시 한번 분석해보자. while 문은 크게 3가지 부분으로 구성돼있는데, ① i라는 변수, 즉 언제까지 반복할 것이냐에 대한 기준점을 초기화 하는 부분,② 그리고 반복적으로 실행할 때 마다 i값을 갱신해주는 부분,③ 그리고 반복을 계속 진행할 것이냐 하는 것을 조건화 해놓은 부분이다. 실제로 코딩을 하다보면 이 3가지를 언제나 사용하게 되고, 따라서 3가지를 하나의 문법적 요소로 결합해놓는다면, 오류가 줄어들고 더 보기 좋은 것임을 알 수 있다. 아래 코드를 살펴보자. var i = 0 while(i < 10){ document.write('hello world '); i = i..
[javascript 언어공부] 반복문(1) - while문 이번에는 프로그래밍적으로 반복적인 방법을 실행하는 방법인 반복문에 대해서 알아보자. 이렇게 반복적인 작업을 영어로는 loop 또는 iterate라고 부른다.영어로된 용어를 이야기하는 이유는, 프로그래밍 하면서 여러가지 문제점에 봉착하게 되는데, 그럴 때 가장 중요한게 검색이며, 국내 자료는 많지 않기 때문에 영어로 자료를 검색해야 하는 경우가 많다. 따라서 이런 키워드들은 알아두면 좋다. 본격적으로 반복문에 대해서 배워보도록 하자. 인간은 반복적인 작업을 잘 하지 못한다. 실수하고 지루해한다.컴퓨터는 인간의 이러한 결점을 대신해주기 위한 도구이며, 컴퓨터는 반복적인 작업을 아주 잘한다. 그럼 우리는 어떻게 컴퓨터에게 반복적인 작업을 시킬 수 있을까? 반복문은 조건문과 함께 프로그래밍 부분을 지탱하는 가장..
[javascript 언어공부] boolean의 대체제 이번에는 조건문과 관련된 부가적인것, 자바스크립트의 특수한 것들에 대해서 좀 더 찾아보자. 조건문에서 if 의 괄호 안에 꼭 boolean만 올 필요는 없다. if(0){alert(1)} //실행이 되지 않는다. if(1){alert(2)} //실행이 된다. 왜냐면 숫자 1는 true로 간주되기 때문이다. 하지만 이런 코드는 쓰지 않는 것이 좋다. 그리고 자바스크립트에서는 false로 간주되는 데이터 형도 있다. if(' '){alert('빈 문자열')} 이것은 실행되지 않는데, 빈 문자열은 자바스크립트에서 false로 간주하기 때문이다. if('estelar'){alert('undefined')} 따라서 if 괄호 안에 문자열을 줄 때에 비로소 alert문이 실행된다. if(undefined){aler..
[javascript 언어공부] 논리 연산자 이번에는 논리연산자에 대해 알아보자.논리연산자는 조건문을 좀더 간결하고, 다양한 방법으로 구사할 수 있도록 도와준다. 논리연산자의 종류는 다음과 같다.&&, ||, ! 첫번째로 &&에 대해 먼저 알아보자. 1. && (& - Ampersand) 일명 앤드앤드인 얘는 숫자 7 위에 특수문자 기호이다. 이고잉 샘은 앰퍼샌드라고 부른다고 해서 찾아보니 &라는 애는 Ampersand 라는 명칭을 가지고 있다. 그리고 우리의 &는 and 라고 읽으며, '그리고'라는 뜻으로 좌항과 우항이 모두 참일 때만 참이 되는 논리연산자이다. 다음 코드를 보자. if(true && true){ // &&는 좌항과 우항이 모두 참일 때에만 참인 값을 return한다. 따라서 이 if문은 참이다. alert(1); } if(tru..
[javascript 언어공부] 조건문(2) 지금까지 배웠던 조건문은 if 괄호 조건 안에 항상 true/false가 있었다. 이는 if안에 boolean이 들어간 다는 것을 설명하기 위해서 이며, 괄호 안에 true/false가 고정돼어 있는 것은 조건문으로서는 소용이 없다. 다만, if 문 괄호 안에 boolean이 들어간 다는 것만 확실하게 알아두자! 이번에는 조건문과 변수가 결합하는 것을 확인할 수 있다. a = 1;if (a === 1){alert(1)} 이 코드에서는 a 변수의 값에 따라 if 문 괄호 안이 true도 될 수 있고, false도 될 수 있다.조건문이 상황에 따라 다른 실행을 하는 가변적인 결과를 내보이는 것이다. 이제 설명할 부분을 알기 위해서 알아야 할 명령이 하나 있는데, 바로 prompt() 이다. var age =..
[javascript 언어공부] 조건문(1) 이번엔 조건문에 대해서 공부해보자. 조건문은 가장 중요한 부분이며, 핵심인 부분이다.컴퓨터가 계산기와 구분되는 가장 중요한 차이중의 하나이기도 하다. 조건문은 앞서 공부했던 '비교'와 매우 밀접하게 연결된다.앞선 비교수업에서 비교를 통해 true나 false라는 값을 얻을 수 있었는데, 이는 boolean이라는 데이터 타입이고, 이는 조건문에서 핵심적인 역할을 수행한다. 먼저 조건문이란, 주어진 조건에 따라 애플리케이션을 다르게 동작하도록 하는 것이다.우리가 만드는 프로그램을 똑똑하게 만드는 것이 조건문, conditional statement라고 한다. 문법을 살펴보자조건문은 if로 시작한다. if(true){ alert('result : true')} if(false){ alert('result : ..
[javascript 언어공부] 비교 이번시간에는 비교라는 주제를 다뤄보자. 값과 값이 있을 때 두개의 값이 같은지, 어떤 것이 큰지 판별하는 것이 비교이다.이는 추후에 배울 조건문과 결합했을 때 큰 힘을 발휘한다. 우선 비교에 대한 이야기를 들어가기 전에 연산자에 대해서 먼저 알아보자. 연산자란, 어떤 작업을 컴퓨터에 지시하기 위한 기호이다. 먼저 대입연산자에 대해서 알아보자. ex) a=1 //a라는 변수에 1이라는 변수에 대입한다 여기서 a는 변수이며, 1은 값(상수-변하지 않는 수)이고, 그 중간에 있는 이콜(=)은 대입연산자(좌항에 있는 값을 우항에 대입한다)이다. 컴퓨터에 a라는 값에 1을 대입하라 라는 명령을 하는 것이다. a=1a=2 는 가능하고, 따라서 a는 변수이지만 1=2 라고는 할 수 없기 때문에 상수(변하지 않는 값)..
[javascript 언어공부] 세미콜론(;) 이번에는 또다른 문법적인 것, 세미콜론에 대해 알아보자. var a = 1; 이라고 입력 후alert(a); 라고 입력 후 실행하면 1이 화면에 출력된다. 근데 ; 이 기호가 대체 무엇일까? 이 세미콜론은 명령이 끝났다는 것을 명시적으로 표시할 때 사용한다. 하지만 여기서 var a = 1alert(a) 라고 입력해도 잘 작동하는데,줄이 바뀌면 자바스크립트는 명령이 끝났다 생각하기 때문이다. 하지만 세미콜론을 붙여주는 것이 좋은데만약 저 코드가 한줄이 되면var a = 1alert(a) 는 오류가 나기 때문에 줄였을 때도 문제없도록 세미콜론을 붙여주는 것이 좋다.var a = 1;alert(a);
[javascript 언어공부] 주석 이번에는 주석에 대해서 살펴보자. 한국어로는 주석, 영어로는 comment라고 한다. 자바스크립트의 주석은 문법적으로 해석되지 않는 영역이며 슬래시슬래시(//) 뒤에 오는 것들이다. //alert(1+2); 라고 입력하면 브라우저 창에서 실행되지 않으며 보통 이용할 때는 alert(1+2); // 결과: 3 또는 //실습용 코드입니다 -밑에 코드의 취지를 설명alert(1+2); 이러한 이유로 주석이 사용된다. 잘 만들어진 코드는 좋은 주석을 가진 코드로, 코드란 시간이 지나면 자기코드가 아니다. 미래의 타인이 되어있을 자기자신이 코드를 이해할 수 있도록 주석을 잘 달아야 하며타인과 함께 협업할 경우에도 자신이 작성한 코드를 설명하기 위해 주석을 사용할 수 있다. 하지만 진정으로 좋은 코드는주석이 필요없..
[javascript 언어공부] 변수 변수란? 변할 수 있는 수 영어로는 variable 이라고 한다. 이는 문자나 숫자같은 값을 담는 컨테이너로 사용된다. 자바스크립트에서 변수를 사용할 때는 var이라는 키워드를 사용하고, 이 키워드는 변수를 선언하겠다는 것을 의미한다. var a = 1;이라고 하면 a라는 이름을 가진 변수를 생성한 것이다. 여기서 var은 생략 가능하지만, 생략할 때는 왜 생략하는가를 알고 있는 상태에서 생략해야 하며,그렇지 않고서는 생략하지 않는것이 좋다. 변수를 사용해보자. var a = 1; console.log(a)라고 하면 1이 출력된다. a값은 바뀔 수 있는데, a가 일종의 그릇이기 때문에 어떤 값이든 들어갈 수 있기 때문이다. 만약 a = 1;b = 2; alert(a+b)는 //3이 출력되고 a = 3이라..