Java Script

Java Script

변수 선언과 초기화

변수

프로그램 실행 도중 임의의 값을 저장해 두고 읽을 수 있는 공간

선언 : 컴퓨터에게 변수를 사용할 것이라고 알리는 역할

초기화 : 선언한 변수에 처음으로 값을 저장하는 과정

변수에 값을 저장하는 법 : 대입연산자(=) 활용

콤마(,)를 활용해 여러 변수를 동시에 선언, 초기화 가능

var a, b, c; a = 6; b = 9; c = 77; console.log(a, b, c); 6 9 77

변수의 값 활용

변수의 이름을 사용하면, 변수의 값을 읽어서 사용 가능

console.log 명령어

괄호 안에 여러 개의 메시지를 콤마(,)로 구분하여 활용 가능

var v1 = 1, v2 = 2, v3= 3 console.log(v1, v2, v3) 1 2 3

자료형

변수에 저장할 수 있는 값의 종류

number Type : 숫자

string Type : 문자열

boolean Type : 참/거짓

typeof()명령어

typeof() 뒤에 따라오는 괄호 안에 들어있는 변수의 type을 알려주는 명령어

var a = 100, b = 3.14; var c = "안녕하세요", d = "a" var e = true, f = false; console.log(a, typeof(a)); console.log(c, typeof(c)); console.log(e, typeof(e)); 100 number 안녕하세요 string true boolean

Number

숫자를 나타내는 자료형

64bit로 실수와 정수 모두 표현 가능

var a = 1 var b = "1" console.log(a, typeof(a)); console.log(b, typeof(b)); 1, number 1, string

ParseInt, ParseFloat 명령어

문자열 "1"과 1은 다르다

명령어 뒤에 따라오는 괄호 안에 있는 문자열의 앞에서부터 Number를 인식

var c = "177.3" console.log(c, typeof(c)); var c_int = parseInt(c) console.log(c, typeof(c_int)); var c_float = parseFloat(c) console.log(c, typeof(c_float)); 177.3 string 177.3 number 177.3 number // 앞에서부터 숫자를 인식하여 string을 number로 인식 var c1 = "177.3 입니다." console.log(c1, typeof(c1)); var c1_int = parseInt(c1) console.log(c1, typeof(c1_int)); var c1_float = parseFloat(c1) console.log(c1, typeof(c1_float)); 177.3 입니다. string 177.3 입니다. number 177.3 입니다. number

Nan, Infinity

수학적 오류가 있는 구문이 실행되거나 결과 값이 변수로 저장될 경우 나옴

var a = 1/0 console.log(a); Infinity

String

따옴표('), 큰따옴표(")로 감싸서 문자열 표현

문자열 안에 따옴표, 큰따옴표 등의 문자를 활용하려면 escape character를 활용 escape character는 역슬래시(\)로 사용 줄바꿈 :

따옴표 : \' 큰따옴표 : \" 역슬래시 : \\

var a='문자열은 따옴표로 둘러싸면 됩니다.'; // 문자열은 따옴표로 둘러싸면 됩니다. var b="큰따옴표로도 문자열을 표현할 수 있습니다."; // 큰따옴표로도 문자열을 표현할 수 있습니다. var c="큰따옴표 문자열에는 따옴표 '를 사용할 수 있습니다."; // 큰따옴표 문자열에는 따옴표 '를 사용할 수 있습니다. var d='따옴표 문자열에는 큰따옴표 "를 사용할 수 있습니다.'; // 따옴표 문자열에는 큰따옴표 "를 사용할 수 있습니다. var e="따옴표를 쓰고 싶다면 \'이렇게\' 사용하면 됩니다. 마찬가지로 \"큰따옴표\"도 쓸 수 있습니다."; // 따옴표를 쓰고 싶다면 '이렇게' 사용하면 됩니다. 마찬가지로 "큰따옴표"도 쓸 수 있습니다. var f='따옴표를 쓰고 싶다면 \'이렇게\' 사용하면 됩니다. 마찬가지로 \"큰따옴표\"도 쓸 수 있습니다.'; // 따옴표를 쓰고 싶다면 '이렇게' 사용하면 됩니다. 마찬가지로 "큰따옴표"도 쓸 수 있습니다. var g="\\ 문자를 쓰고 싶다면 역슬래시를 두번 씁니다."; // \ 문자를 쓰고 싶다면 역슬래시를 두번 씁니다. var h="문자열에서 줄바꿈을 하고 싶다면,

역슬래시n을 사용합니다."; // 문자열에서 줄바꿈을 하고 싶다면, // 역슬래시n을 사용합니다. var i=a+b; // 문자열은 따옴표로 둘러싸면 됩니다.큰따옴표로도 문자열을 표현할 수 있습니다. var j="abcde"; // abcde

Object

number, string, boolean의 단순 자료형보다 더 복잡한 자료를 표현할 때 사용

객체를 만드는 법

중괄호{}를 사용해 정의 가능

객체는 속성의 집합으로 이루어짐 각 속성은 이름과 값으로 이뤄짐 객체 정의 시 -속성이름:값- 의 형태로 속성 정의 가능 속성의 값은 모든 자료형 가능, object 포함

var empty_obj = {}; console.log(typeof(empty_obj)); // object var man = { name:"옥택연", age:20, height:180}; console.log(man); // { name:'옥택연', age:20, height:180}

객체의 속성에 접근하는 법

객체이름.속성이름

객체이름["속성이름"]

// 객체이름.속성이름 console.log(man.name); // 옥택연 // 객체이름["속성이름"] console.log(man["age"]); // 20

객체 속성 변경하는 법

man.name = "유아인"; man["age"] = 22; console.log(man); // { name: '유아인', age: 22, height: 180 }

undefined

시스템에서 어떤 변수나 속성이 정의되지 않은 경우를 표현하기 위해 사용

선언만 하고 초기화가 되지 않는 변수의 타입이나 값

객체의 정의되지 않은 속성의 타입이나 값

var a; console.log(a); // undefined var obj = {x:1, y:2} console.log(obj.x); console.log(obj.y); console.log(obj.z); // 1 // 2 // undefined

null

개발자가 명시적으로 아무것도 없는 비어있는 상태를 나타낼 때 사용

typeof의 결과는 object이며 값은 null

var c; c = null; console.log(c, typeof(c)); // null object

연산자와 함수

이항연산자(binary operator)

두개의 피연산자(A, B)를 가지는 연산자. A 연산자 B 의 꼴로 사용. 피연산자는 변수나 숫자가 될 수 있다.

A + B

A - B

A * B

A / B

A % B

단항연산자(unary operator)

하나의 피연산자(A)를 가지는 연산자. 보통 연산자A의 꼴로 사용한다. 대표정으로 - 연산자가 있으며, -A의 꼴로 사용하는 경우 -는 이항 연산자가 아닌, 단항연산자이다. A변수에 -1을 곱한 효과가 발생한다.

증감연산자(++, --)

표현식 안에서 변수의 값을 증가하거나 감소 가능

각각, A=A+1, A=A-1 의 효과를 발생. 연산자를 변수 앞에 사용한 경우와 변수 뒤에 사용한 경우에 따라 변수의 값 업데이트 순서 변경

var a; a = 1; console.log(++a); console.log(a); // 2 // 2 a = 1; console.log(a++); console.log(a); // 1 // 2

Math 관련 명령어

// a의b승을 구함 var a = Math.pow(2,3); console.log(a); // a의 제곱근 구함 var b = Math.sqrt(16); console.log(b); //0~1사이의 난수 반영 var c = Math.random(); console.log(c); // 8 // 4 // 0.2787621635095887

함수

호출에 의해 여러번 실행할 수 있는 코드 블럭

반복되는 코드 감소

코드의 개발 및 수정 용의

function 함수이름(파라미터1, 파라미터2){ 실행코드 return 반환값; }

파라미터 : 함수의 정의 부분에 나열된 변수

여러개인 경우 콤마(,) 구분 파라미터가 필요없는 경우 없어도 됨 함수 안의 코드에서 변수처럼 활용 가능

return 구문 : 함수의 출력으로 내보낼 값 return 구문을 만나면 함수는 즉시 종료됨 함수를 호출한 표현식은 반환값으로 대치됨

function test() { return; console.log("실행되지 않는 코드"); } console.log(test()); // undefined // return 하는 결과 값이 없기 때문

관계연산자(Relational operator)

두 표현식(A, B)의 관계를 비교하는 이항연산자. 관계에 따라 boolean 타입의 true, false로 표현됨

관계연산자 동작 True인 예시 False인 예시 < A보다 B가 더 큰 경우 참 3 < 5 3 < 3 > A보다 B가 더 작은 경우 참 5 > 3 3 > 3 <= A보다 B가 크거나 같은 경우 참 3 <= 3 4 <= 3 >= A보다 B가 작거나 같은 경우 참 3 >= 3 3 >= 4 == A와 B가 같은 경우 참 3 == 3 4 == 3 != A와 B가 같지 않은 경우 참 3 != 4 3 != 3

논리연산자(Logical operator)

두 boolean 피연산자에 대해 연산하는 연산자

AND(&&) 연산자 두 피연산자가 모두 true인 경우에만 true를 나타내는 이항연산자

AND(&&) True False True True False False False False

OR(||) 연산자 두 피연산자가 하나라도 true인 경우 true를 나타내는 이항연산자

OR(||) True False True True True False True False

NOT(!) 연산자 피연산자가 true인 경우 false를, false인 경우 true를 나타내는 단항연산자

연산자 우선순위

++, --

!

*, /, %

+, -

<, <=, >, >=

==, !=

&

||

괄호

우선순위를 명시하기 위해 괄호를 사용. 괄호안의 계산식이 먼저 계산됨

부가적 효과 코드의 가독성 향상 연산자 우선순위 실수 방지

참고링크 : https://programmers.co.kr/learn/courses/3

from http://cloud-cuckoo-land.tistory.com/26 by ccl(A) rewrite - 2021-11-09 02:01:53