본문 바로가기

📰 언어/JS - 비기너 편

(8)

메소드 MDN_Method > 1. 메소드 정의 const obj = { foo() { return 'foo'; } bar: function() { return 'bar'; } }; console.log(obj.foo()); // expected output: "foo" 2. 메소드 호출 형태 1) OOP의 일바적인 메소드 호출 형태 var data = ["book", "책", "123"] var obj = new Array(); var result = obj.concat(data); //concat 메소드 호출 2) JS의 메소드 호출 형태 - 데이터로 메소드 호출 var data = ["book", "책", "123"] var result = data.concat(); //Array의 concat 메소드 호..

ES6 - class MDN_Classes > function 오브젝트를 생성하는 목적 그저 function 오브젝트 개념으로 사용하거나 또는 클래스 개념으로 사용하기 위해서 function 오브젝트를 생성하였다. # 프로토타입에 메소드를 작성 X => 그저 function 오브젝트 개념 var book = function(){}; # 프로토타입에 메소드 작성 O => 클래스 개념 var Book = function(){}; Book.prototype.getBook = function(){}; ES6이전의 자바스크립트는 prototype에 메소드를 연결하여 클래스 개념을 사용하였다. 하지만, ES6부턴 class키워드가 추가되면서 class키워드를 이용하여 클래스를 생성할 수 있다. class 1. class class는 사..

for()과 forEach() MDN_Array.prototype.forEach() > forEach() 배열에 있는 각 요소에 대해 하나씩 읽어 가면서 콜백 함수를 호출한다. 삭제했거나 초기화하지 않은 인덱스 속성에 대해서는 실행하지 않는다. 콜백 함수 파라미터 : 엘리먼트 값, 인덱스, 배열 전체 let list = ["A", "B", "C"]; list.forEach(function(el, index, all){ log(el + ":" + index + ":" + all); }); //A:0:A,B,C //B:0:A,B,C //C:0:A,B,C 콜백 함수를 분리할 수 있어 독립성이 좋아진다. var list = ["A", "B", "C"]; var list2 = ["D", "F", "G"]; var fn = function(el..

함수 프로퍼티 - call, apply/ bind MDN_Function.prototype.call() > MDN_Function.prototype.apply() > MDN_Function.prototype.bind() > 1. call() : 함수 호출 주어진 this 값 및 각각 전달된 인수와 함께 함수를 호출한다. function getTotal(one, two){ return one + two; } let result = getTotal.call(this, 10, 20); log(result); //30 call() 메소드의 첫 번째 파라미터에는 호출된 함수에서 this로 참조할 오브젝트를 작성한다. 일반적으로 this를 사용하지만, 다른 오브젝트로도 작성이 가능하다. let value = {one: 10, two: 20}; function ge..

오브젝트 프로토타입 JavaScript : 프로토타입의 이해 > MDN_Object Prototypes > 생활코딩_prototype > JavaScript는 기존의 객체를 복사(cloning)하여 새로운 객체를 생성하는 프로토타입 기반의 언어이다. 프로토타입 기반 언어는 객체 원형인 프로토타입을 이용하여 새로운 객체를 만들어낸다. 1. 함수와 객체의 내부 구조 이해 1) 함수 정의 함수 멤버로 prototype속성이 있다. 이 속성은 다른 곳에 생성된 함수이름의 프로토타입 객체를 참조한다. 프로토타입 객체의 멤버인 constructor속성은 함수를 참조하는 내부구조를 가진다. function Person(){} 2) Person함수를 통해 객체 생성 Person 함수의 prototype속성이 참조하는 프로토타입 객체는 n..

new 연산자 MDN_new operator > new 연산자 new 연산자는 오브젝트로 인스턴스를 생성하여 반환한다. 원본을 복사하는 개념이다. 코딩관례로 첫 문자를 대문자로 작성한다. => 인스턴스를 만들겠다는 시맨틱이다. const obj = new Number() 인스턴스를 생성하는 목적은 인스턴스마다 값을 다르게 갖게 하기 위함이다. const oneObj = new Number("121"); const twoObj = new Number("456"); log(oneObj.valueOf()); //123 log(twoObj.valueOf()); //456

데이터 타입 MDN_자바스크립트의 자료형 > object 참고한 게시물 > 1. Primitive Type 더 이상 나눠질 수 없는 single item (string, number, bigint, boolean, null, undefined, ES6 부터 추가된 symbol) 원시 타입은 변수에 할당될 때, 메모리의 고정 크기로 원시 값을 저장하고 해당 저장된 값을 변수가 직접적으로 가리키는 형태를 띈다. Object를 제외한 모든 값은 변경 불가능한 값(immutable value)이다. 재할당 시 기존 값이 변하는것 처럼 보일지 몰라도 사실 새로운 메모리에 재할당한 값이 저장되고 변수가 가리키는 메모리가 달라졌을 뿐이다. 2. Object single item들을 묶어서 한 단위로 관리할 수 있게 해주는 데이터..

변수 선언 (var, let, const) 1. 변수 선언 3가지 방법 1) var ( function scope, mutable ) 되도록 사용하지 말 것! # 선언과 초기화 var i; // 선언, "undefined"가 저장됨 var sum = 0; // 선언과 초기화 # 한 번에 여러 개의 변수를 함께 선언할 수 있음 var i, sum; # 선언과 초기화를 동시에 해줄 수 있음 var i=0, sum=10, message=”Hello”; # 선언되지 않은 변수는 전역 변수가 됨 name = "javascript"; var의 문제점 변수의 정의를 위쪽으로 끌어올리기(변수 호이스팅) 때문에, 변수를 정의하기 전에 그 변수를 사용해도 에러가 발생하지 않는다. 블록 단위를 철저히 무시하는 함수 유효범위를 가진다. var로 선언한 변수는 재정의가..

이전 1 다음

티스토리툴바