'프로그래밍/Java script'에 해당하는 글 5건

자바스크립트에서는 함수도 객체다!!!

즉, 함수의 기본 기능인 코드 실행뿐만 아니라 함수 자체가 일반 객체처럼 프로퍼티들을 가질 수 있다.

 

function add(x, y) {
	return x + y;
}

add.result = add(1, 2);
add.status = 'OK';

console.log(add.result); // 5
console.log(add.status); // OK

 

정리하자면 자바스크립트의 함수란

- 리터럴에 의해 생성.

- 변수나 배열의 요소, 객체의 프로퍼티 등에 할당 가능.

var foo = 100;
var bar = function() { return 100;};
console.log(bar());     // 100

var obj = {};
obj.baz = function() { return 200;}
console.log(obj.baz()); // 200

- 함수의 인자로 전달 가능.

var foo = function(func) {
	func();
};

foo(function() {
	console.log('Function can be used as the argument');
};

- 함수의 리턴값으로 리턴 가능.

var foo = function() {
	return function() {
    	console.log('this function is the return value');
    }
};

var bar = foo();
bar();

- 동적으로 프로퍼티를 생성 및 할당 가능.

'프로그래밍 > Java script' 카테고리의 다른 글

함수 생성 방법  (0) 2019.05.29
자바스크립트 데이터 타입2  (0) 2018.08.04
자바스크립트 데이터 타입1  (0) 2018.08.04
자바스크립트(JavaScript)란?  (0) 2018.07.21

WRITTEN BY
김치치즈스마일
세계정복!

,

자바스크립트에서는 크게 세가지의 함수 선언 방식이 있다.

 

1. 함수 리터럴 방식

- function keyword로 시작.

- function keyword, 함수명(필수가 아닌 선택사항), 매개변수 리스트, 함수 몸체로 구성.

 

function add(x, y) { // 함수명인 add는 선택사항.
	return x + y;
}

 

1-1. 함수 선언문 방식

- 함수 리터럴 방식과 형태는 같으나 함수명이 반드시 정의되어 있어야 함.

 

function add(x, y) { // 함수명인 add는 필수 정의.
	return x + y;
}

 

2. 함수 표현식

- 함수 리터럴 방식으로 함수를 만들고, 이를 변수에 할당하여 함수를 생성하는 방식.

- 함수명은 선택 사항이며, 보통 사용하지 않음.

- 함수 표현식에 사용된 함수명은 외부 코드에서 접근이 불가능.

 

var add = function(x, y) { // add는 함수 변수이지 함수명이 아님.
	return x + y;
};

var plus = add;
console.log(add(1, 2));  // 3
console.log(plus(2, 3)); // 5
var add = function sum(x, y) { // add는 함수 변수이지 함수명이 아님.
	return x + y;
};

console.log(add(1, 2));  // 3
console.log(sum(1, 2)); // Uncaught ReferenceError : sum is not defined 

 

3. Function() 생성자 함수를 통한 방식

- 자바스크립트의 함수도 Function()이라는 기본 내장 생성자 함수로 부터 생성된 객체.

- 잘 쓰지 않음.

 

var add = new Function('x', 'y', 'return x + y');
console.log(add(3, 4) // 7

 

 

[출처] 인사이드 자바스크립트

'프로그래밍 > Java script' 카테고리의 다른 글

함수도 객체다!  (0) 2019.05.29
자바스크립트 데이터 타입2  (0) 2018.08.04
자바스크립트 데이터 타입1  (0) 2018.08.04
자바스크립트(JavaScript)란?  (0) 2018.07.21

WRITTEN BY
김치치즈스마일
세계정복!

,

앞선 내용에서 자바스크립트의 기본 데이터 타입들을 정리했었는데 이번에는 참조 타입에 대해서 정리해보자.

 

참초 타입(객체 타입)이란?

- 자바스크립트에서 숫자, 문자열, 불린값, undefined, null 같은 기본 타입을 제외한 모든 값은 객체.

  따라서 배열, 함수, 정규표현식 등도 모두 자바스크립트에서는 객체로 표현.

- 자바스크립트에서의 객체는 단순히 이름(key):값(value) 형태의 프로퍼트들을 저장하는 컨테이너.

- 기본 타입의 경우 하나의 값만을 가지는데 비해, 참조 타입인 객체는 여러 개의 프로퍼티들을 포함할 수 있음.

- 기본 타입의 값을 포함하거나, 다른 객체를 가리킬 수도 있음.

 

객체 생성 방법

- Object() 생성자 함수 이용

// Object()를 이용해서 foo 빈 객체 생성
var foo = new Object();

// foo 객체 프로퍼티 생성
foo.name = 'foo';
foo.age = 30;
foo.gender = 'male';

console.log(typeof foo); // (출력값) object 
console.log(foo); // (출력값) { name: 'foo', age: 30, gender: 'male' }

- 객체 리터럴 방식 이용

// 객체 리터럴 방식으로 foo 객체 생성 
var foo = {
     name : 'foo',
     age : 30,
     gender : 'male'
};
console.log(typeof foo); // (출력값) object 
console.log(foo); // (출력값) { name: 'foo', age: 30, gender: 'male' }

- 생성자 함수 이용

 

객체의 프로퍼티에 접근하는 방법

- 대괄호([]) 표기법

var foo = {
     name : 'foo',
     nick-name : 'foo2',
     major : 'computer science'
};

console.log(foo['name']); // (출력값) foo
console.log(foo[name]); // (출력값) undefined
console.log(foo['nick-name']) // (출력값) foo2

대괄호 표기법 사용시 대괄호 안에 프로퍼티 이름을 문자열 형태로 사용해야 함.

만약 프로퍼티 이름을 문자열 형태로 쓰지 않을 경우 undefined로 출력되는 것을 볼 수 있음.

또한 접근하는 프로퍼티가 표현식이나 예약어일 경우 대괄호 표기법만을 이용해서 접근해야 함.

예를 들어서 위에서 볼 수 있는 nick-name이라는 프로퍼티의 경우 마침표 표기법을 쓸 경우 NaN의 값이 출력됨.

 

- 마침표(.) 표기법

var foo = {
     name : 'foo',
     nick-name : 'foo2',
     major : 'computer science'
};

console.log(foo.name); // (출력값) foo
console.log(foo.nick-name) // (출력값) NaN

 

객체 프로퍼티 삭제

자바스크림트에서는 delete 연산자를 이용해 객체의 프로퍼티를 삭제할 수 있음.

delete 연산자는 객체의 프로퍼티를 삭제할 뿐, 객체 자체를 삭제하지는 못함.

var foo = {
     name : 'foo',
     major : 'computer science'
};

console.log(foo.name); // (출력값) foo
delete foo.name;
console.log(foo.name) // (출력값) undefined
delete foo;
console.log(foo.major); // (출력값) 'computer science

 

[출처] 인사이드 자바스크립트

 

· 자브스크립트 데이터 타입1

 

 

'프로그래밍 > Java script' 카테고리의 다른 글

함수도 객체다!  (0) 2019.05.29
함수 생성 방법  (0) 2019.05.29
자바스크립트 데이터 타입1  (0) 2018.08.04
자바스크립트(JavaScript)란?  (0) 2018.07.21

WRITTEN BY
김치치즈스마일
세계정복!

,

자바스크립트는 크게 기본 타입과 참조 타입으로 데이터 타입이 나뉜다.

또한 기본 타입은 숫자(Number), 문자열(String), 불린 값(Boolean), undefined, null로 나뉜다.

이번에는 자바스크립트이 기본 타입들에 관하여 알아보자.

 

 

※ 자바스크립트의 데이터 타입

 

기본 타입이란?

- 자바스크립트의 기본 타입에는 숫자(Number), 문자열(String), 불린값(Boolean), undefined, null이 있음.

- 그 자체가 하나의 값을 나타냄

 

숫자(Number)

- 다른 언어들의 경우 대게 정수, 실수에 따라서 int, long, float, double 등 다양한 숫자 타입이 존재하지만 자바스크립트에서는 단 하나의 숫자형만 존재

- 자바스크립트에서는 모든 숫자를 64비트 부동 소수점 형태로 저장하기 때문

- 단, 자바스크립트에서는 모든 숫자를 실수로 인식하기 때문에 소수부분까지 출력하게 됨


var num = 5 / 2;
console.log(num); // 2.5 출력
console.log(Math.floor(num)); // 2 출력

 

문자열

- 문자열은 작은 따옴표(')나 큰 따옴표(")로 생성

- C나 Java와 같이 char라는 문자 하나만을 나타내는 데이터 타입이 별도로 존재하지 않음

- 한번 정의된 문자열은 변하지 않음


var str = 'test';
console.log(str[0], str[1], str[2], str[3]); // test 출력
str[0] = 'T';
console.log(str); // test 출력

 

불린값

- true, false 값.

 

undefined

- 값이 비어있음을 나타냄

- 자바스크립트 환경 내에서 기본적으로 값이 할당되지 않은 변수

- 변수 자체의 값 또한 undefined

- 즉, 자바스크립트에서의 undefined는 타입이자 값을 나타냄

 

null

- 값이 비어있음을 나타냄

- 개발자가 명시적으로 값이 비어있음을 나타내느데 사용

- null 타입의 typeof 결과는 null이 아니라 object

 

 

[출처] 인사이드 자바스크립트


'프로그래밍 > Java script' 카테고리의 다른 글

함수도 객체다!  (0) 2019.05.29
함수 생성 방법  (0) 2019.05.29
자바스크립트 데이터 타입2  (0) 2018.08.04
자바스크립트(JavaScript)란?  (0) 2018.07.21

WRITTEN BY
김치치즈스마일
세계정복!

,

자바스크립트란 무엇일까? 우리가 흔히 알고 있는 자바(Java)랑 이름이 비슷한데 자바의 다른 이름인 것일까?

아니면 형제 관계의 언어일까?

지금부터 자바스크립트란 무엇인지 알아보자! 

 

자바스크립트란?

웹 브라우저에서 동작하는 스크립트 언어.

넷스케이프에서 개발되었으며 초기에는 라이브스크립트라는 이름으로 개발.

이후 썬 마이크로시스템에서 개발한 자바와 이름을 같게 하는 마케팅 조약을 체결한 후, 자바스크립트라는 이름으로 발전하기 시작.


자바스크립트의 장점

- 유연하며 뛰어난 표현력을 가짐.

- 느슨한 타입 체크로 개발자에게 타입 체크에 대한 자유를 줌.

- 웹개발, 서버개발, 애플리케이션 개발 등 다양한 용도에 쓰일 수 있음.


자바스크립트의 단점

- 디버깅이 어려움

- 타입 체크가 자유로운만큼 컴파일 타임에서 에러를 발견하지 못하고 런 타임 시 발견.

- 최상위 레벨의 객체들은 모두 전역 객체 안에 위치하여, 이름 충돌의 위험성 존재.

 


[출처] 네이버 백과사전

[출처] 인사이드 자바스크립트

'프로그래밍 > Java script' 카테고리의 다른 글

함수도 객체다!  (0) 2019.05.29
함수 생성 방법  (0) 2019.05.29
자바스크립트 데이터 타입2  (0) 2018.08.04
자바스크립트 데이터 타입1  (0) 2018.08.04

WRITTEN BY
김치치즈스마일
세계정복!

,