본문 바로가기

웹/JavaScript28

자바스크립트 변수, 상수, 불변값, 불변성 변수(variable) : 변할 수 있는 수, 변할 수 있는 무언가 식별자(identifier) : 변수의 뜻에서 '무언가'는 데이터라 함. 숫자, 문자열, 객체, 배열 모두 데이터. 식별자는 어떤 데이터를 식별하는 데 사용하는 이름, 즉 변수명 변수 선언 a는 undefined이더라도 나중에 다른 값으로 바꾸면 된다 let a; 데이터 할당 var a;//변수 a선언 a = 'abc';//변수 a에 데이터 할당 var a = 'abc';//변수 선언과 할당을 한 문장으로 표현 불변값 변수(variable)와 상수(constant)를 구분하는 성질은 '변경 가능성'이다. 바꿀 수 있으면 변수, 바꿀 수 없으면 상수. 변수와 상수를 구분 짓는 변경 가능성의 대상은 변수 영역 메모리이다. 한 번 데이터 할당.. 2022. 11. 13.
ES6. setPrototypeOf Object.setPrototypeOf() 주어진 객체의 Property를 변경 또는 null로 설정할 수 있다. 구문 Object.setPrototypeOf(obj, prototype); @param object : 프로토 타입을 변경할 객체 @param prototype : 새 프로토 타입의 값 또는 null let person = { drive() { return 'driving car'; } } let animal = { sleep() { return 'zzZ'; } } // Set person's __proto__ to animal's __proto__'s __proto__ Object.setPrototypeOf(animal, person); console.dir(animal);//object .. 2021. 1. 21.
JS Object.assign() 객체 복사, spread operator( ...) 차이점 Object.assign (ECMAScripy 2015) 얕은 복사(shallow copy)로 두 오브젝트를 병합할 수 있다. 정적 메소드로 인수(argument)로 받은 객체들의 모든 열거 가능한 속성(property)을 대상 객체에 복사한다. 첫 번째로 들어오는 인자(argument)로 들어오는 객체에 두 번째 인자로 들어오는 객체의 프로퍼티들을 차례대로 덮어쓰기하여 반환하는 메소드이다. 출처값이 객체에 대한 참조인 경우 참조값만 복사한다. 구문 Object.assign(target, ...sources) * @param target 복사 할 대상 개체 * @param source 속성을 복사 할 원본 개체 spread operator와 object.assign 차이점 //spread operator.. 2021. 1. 20.
ES6. Class 클래스 자바스크립트 Class ES6이전에는 class 대신 함수(function)으로 생성자를 만든 후 프로토타입(prototyp)으로 메서드를 할당하는 방식으로 사용해왔다. ES6에서는 class 키워드(keyword)가 추가됐다. class를 만드는 방법 class Person{//class 선언 constructor(name, age, gender){//constructor 생성자 메서드 this.name = name; this.age = age; this.gender = gender; } showName(){//클래서 Person에서 정의한 메서드 alert(this.name); } } let person = new Person('hun', 20, 'male'); person.showName(); co.. 2021. 1. 19.
ES6. rest parameter, spread operator 차이 spread operator(펼침연산자) const arr = [1, 2, 3, 4]; console.log(arr);//[1,2,3,4] console.log(...arr); //1,2,3,4 console.log([...arr]); // [1,2,3,4] spread 연산자를 사용하면 배열이 아니라 개별 요소로 결과값이 나온다. [...spread operator]의 형태로 쓴다면 결과는 배열이 된다. rest parameter(나머지 매개변수) function restParam(param1, param2, ...rest) { console.log(param1); //1 console.log(param2); //2 console.log(rest); //[3,4,5,"rest!";] } restPara.. 2021. 1. 18.
ES6. 화살표 함수 (Arrow Function) 화살표 함수(Arrow Function) // es6 이전 function(){ } // es6 이후 () => {} function(){}; 이렇게 생긴 함수를 () => ; 화살표로 구문을 짧게 표현할 수 있다. //es6 이전 var add = function (x, y) { return x + y; } console.log(add(2, 10)); //es6 이후 const add2 = (x, y) => x + y; console.log(add2(2, 10)); 화살표 함수는 함수 이름을 쓸 수 없다. 핸들링 하기 위해 변수에 넣어서 사용하면 된다. //es6 이전 var newArr = [1, 2, 3, 4, 5].map(function (value) { return value * 2; }); c.. 2021. 1. 17.

티스토리툴바