프로그래밍/Javascript33 JavaScript 기초 : 추상화 5. 로컬변수와 글로벌변수 5. 로컬변수와 글로벌변수 변수에는 Scope 즉 범위, 영역이 있다. 변수에는 즉! 유효한 범위가 있다는 말이다. 이 말이 더 어려운데;;; 변수는 로컬 변수(지역 변수)가 있고 글로벌 변수(전역 변수) 가 있다. 로컬 변수는 정해진 범위에서만 사용할 수 있고 글로벌 변수에서는 코드를 작성하고 있는 어느 곳에서나 사용할 수 있다. 먼저 글로벌 변수의 예시를 보자. 아래 그림처럼 변수 x를 선언해주고 x값을 콘솔에 출력하라는 명령을 내렸다. let x = 3 console.log(x); 결과는 어떻게 나올까? 당연히 3이 출력된다. 그렇다면 만약 글로벌 변수를 선언하고 똑같은 x를 함수 내에서 다르게 선언하면 어떻게 될까? //글로벌 변수(Global Variable) let x = 1 //블록문(Blo.. 2020. 9. 7. JavaScript 기초 : 추상화 4. 함수 옵셔널 파라미터 4. 함수 파라미터 파라미터가 있는 부분에 아무 값도 쓰지 않고 함수를 호출하는 경우에는 undefined 값이 나온다. 아래 그림처럼 t라는 변수에 아무것도 쓰지 않고 t변수를 출력할 때에도 undefined 값이 나오고 Hello라는 함수에 return 문이 없어서 이 함수를 출력하니 undefined 값이 나왔다. 하지만 파라미터에 기본 값을 정하는 방법이 있다. 바로 옵셔널 파라미터이다. 4-2. 함수 옵셔널 파라미터 함수를 호출 할 때 파라미터 값을 전달해도 되고 생략해도 되니까 선택적으로 전달을 받는다고 해서 이런 파라미터를 옵셔널 파라미터라고 부른다. nationality 에 한국이 기본적으로 들어 있기 때문에 introduction('James', 20);으로 함수를 호출 했을 경우 따로 .. 2020. 9. 7. JavaScript 기초 : 추상화 3. return문 이해하기 3. return문 이해하기 return문의 역할 2가지 1. return문은 어떤 값을 되돌려주는 output의 역할을 한다. (함수 호출 부분을 return문 뒤에 오는 값으로 대체한다.) 2. return문은 함수의 실행을 중단한다. (현재 함수 실행을 멈추고 함수가 호출된 지점으로 돌아가서 진행한다.) ???? 세상에 무슨 말이지? 내가 이해한 바로 풀어써보자. return은 함수를 실행해서 얻은 어떤 값을 당장 콘솔에 출력하는 것이 아니다. 보통 console.log()와 헷갈리는데 return은 단순히 return 다음 값으로 대체! 하는 것이다. 그래서 return 뒤의 값은 다른 연산이나 함수 실행을 위해 사용하고 싶을 때 사용할 수 있다. ??? 그래도 어렵고 헷갈리니 예시를 살펴보자. .. 2020. 9. 7. JavaScript 기초 : 추상화 2. 함수 정의와 호출 2. 함수(Function) 정의와 호출 기본적으로 코드는 왼쪽에서 오른쪽, 위에서 아래로 읽고 쓴다. 그래서 함수를 정의하고 호출 할 때도 위에서 아래로 왼쪽에서 오른쪽으로 순서대로 정의하고 순서대로 호출한다고 생각하면 된다. 함수를 정의하는 것과 함수를 호출하는 것은 다르다. 함수를 정의할 때는 function 함수이름(파라미터){ 함수 내용 } 이렇게 정의하면 된다. 그리고 함수를 호출할 때는 함수 이름(파라미터) 이렇게 써주면 된다. 함수를 정의한 뒤 함수를 호출하면 함수 내에 있는 모든 내용들을 호출한다. 함수를 호출한 뒤에는 다음 줄로 이동한다. 예시를 살펴보자. fucntion square(x){ return x * x; } console.log('함수 호출 전'); square(5) con.. 2020. 9. 7. JavsScript 기초 : 추상화 1. 할당 연산자(Assignment operators) 1. 할당 연산자(Assignment operators) '할당' 했다는 것은 지정했다, 정했다, 대입했다라는 의미이다. 수학에서 등호는 왼쪽과 오른쪽이 같다는 의미이지만 프로그래밍에서는 오른쪽에 있는 피연산자(연산이 되어 지는 대상)를 왼쪽에 있는 피연산자에 할당한다는 의미이다. 예시를 살펴보자. let name = 'yunju'; let x = 5; x = x - 2; console.log(x); 일단 오른쪽부터 계산을 해준다. x 가 현재 5이기 때문에 x -2 는 5 - 2, 즉 3이 된다. 그 다음 왼쪽 x에 3을 할당해준다. 결과적으로 이 코드는 x의 값을 2만큼 줄여주는 코드라고 볼 수 있다. 2. 복합 할당 연산자(Compound assignment operators)) 복합 할당 연산자는.. 2020. 9. 7. JavaScript 기초 : 자료형 7. null과 undefined JavaScript 자료형 마지막! JavaScript자료형에는 숫자형, 문자형, 불린 등이 있다. 값을 저장할 때 아무것도 저장을 안하는 경우도 있고 의도적으로 null값을 저장하기도 한다. 두 경우가 콘솔에 다르게 표시되는데 이번 글에서는 null과 undefined에 대해 알아보려 한다. 7. null과 undefined 둘 다 값이 없다는 의미이다! 하지만 완전히 다르다. ??? 무엇이 다른지 살펴보자! null은 값이 없다는 것을 의도적으로 표현할 때 사용한다. undefined는 코드를 실행할 때 값이 없다는 것을 확인할 수 있는 것이다. 둘을 명확하게 이해하지 못한다면 코드를 작성할 때 실수가 생긴다. 이해 필수!!! 1) 변수 지정을 할 때 아무 값을 안 넣은 경우 자바스크립트에서는 값이 .. 2020. 9. 4. JavaScript 기초 : 자료형 6. 템플릿 문자열 JavaScript 자료형 JavaScript자료형에는 숫자형, 문자형, 불린 등이 있다. 특히 문자열을 작성할 때 편리하게 작성하는 방법이 있는데 그 방법이 바료 템플릿 문자열이다. 이번 글에서는 템플릿 문자열 사용 방법에 대해 알아보자! 6. 템플릿 문자열 템플릿 문자열은 특정한 형식을 가진 문자열을 말한다. 문자열을 연결할 때 + 기호를 사용하면 된다. 하지만 +를 매 번 써줘야 하는 번거로움이 있기 때문에 좀 더 빠르고 쉽게 문자열과 변수, 숫자 등을 연결하는 방법이 바로 템플릿 문자열을 사용하는 방법이다. ${}을 사용하면 +를 사용하지 않아도 문자를 쭉 이어서 작성할 수 있다. line7과 line8을 비교해보면 ${}을 사용하는게 얼마나 편한지 알 수 있다. ${}을 사용할 때에는 문장의 처.. 2020. 9. 4. JavaScript기초 : 자료형 5. 형 변환ⅰ,ⅱ JavaScript 자료형 JavaScript자료형에는 숫자형, 문자형, 불린 등이 있다. 각 자료형은 형 변환이 가능하다. 이번 글에서는 형 변환에 대해 알아보도록 하자! 5-1. 형 변환(Type Conversion) 형 변환이란 처음 값으로 정해진 자료형을 다른 자료형으로 변환하는 것이다. 이 때 다른 복잡한 코드를 작성할 필요 없이 자바스크립에서 제공하는 함수를 사용하면 된다. 문자열로 바꾸고 싶으면 String, 숫자로 바꾸고 싶으면 Number, 불린으로 바꾸고 싶으면 Boolean 함수 를 사용할 수 있다. 위의 그림을 보면 콘솔에서 문자는 검정 글씨, 숫자는 파란 글씨로 나온다. 형변환을 시킨 line6과 7을 보면 line 2와 3의 검정, 파란 글씨의 순서가 파란, 검정 글씨로 바뀌어 .. 2020. 9. 4. JavaScript기초 : 자료형 4. type of 연산자/ 연산자 우선순위 4. type of 연산자 값의 자료형을 평가해서 number인지 string인지 boolean인지 문자열로 반환한다. 숫자인지, 문자열인지, 함수인지 등등을 문자열로 반환하여 콘솔에 보여준다. 중요 포인트! typeof 연산자는 사칙연산자보다 우선순위가 높다! line38의 경우 typeof 8을 먼저 해서 문자열 number가 될 것이고 문자열과 숫자3을 계산해야하니 '숫자가 아니다.' 라는 NaN이 나오게 된 것이다. 이럴 경우에는 line41처럼 괄호를 씌워주면 된다~! 4-2. 연산자 우선순위(precedence) 숫자연산의 경우 사칙연산 우선순위를 생각하면 편하다. 곱셈, 나눗셈을 먼저 그 다음은 덧셈, 뺄셈이다. 우선순위가 같으면 왼쪽부터 시작해서 오른쪽으로 연산이 수행된다. 연산자 우선순위.. 2020. 9. 4. JavaScript 기초 : 자료형 3. 불 대수/ 불린형 JavaScript 자료형 JavaScript자료형에는 숫자형, 문자형, 불린 등이 있다. 그 중 세 번째 불린에 대해 알아보겠다. 3-1. 불 대수 일상전인 논리를 수학적으로 표시한 것 불 대수의 값은 진리 값이다. 어떤 명제가 참인지, 거짓인지 나타낸다. (True, False) 일반 수학의 연산기호는 +, - 등이지만 불대수의 연산은 and, or, not 이 3가지이다. 불 대수를 알려면 명제를 알아야한다. 1) 명제란 무엇일까? 명제는 참 또는 거짓이 확실한 문장을 말한다. ex) 대한민국의 수도는 서울이다. : 참인 명제 2는 1보다 크다. : 참인 명제 나는 멋지다 : 명제가 아님 2) And연산 x 와 y가 모두 참일 때만 x And y 가 참이다. 둘 중 하나라도 거짓이면 x And y .. 2020. 9. 4. 이전 1 2 3 4 다음
