자바 스크립트26 자바스크립트 new 연산자와 생성자 함수 객체 리터럴{ ... } 를 사용하면 객체를 쉽게 만들 수 있다. 그런데 개발을 하다 보면 유사한 객체를 여러개 만들어야 할 때가 생기곤한다. 'new' 연산자와 생성자 함수를 사용하면 유사한 객체 여러개를 쉽게 만들 수 있다. 생성자 함수 생성자 함수(construnctor function)와 일반 함수에 기술적인 차이는 없다. 하지만 생성자 함수는 두 관례를 따른다. 1. 함수 이름의 첫 글자는 대문자로 시작한다. 2. 반드시"new" 연산자를 붙여 실행한다. function User(name) { this.name = name; this.isAdmin = false; } let user = new User("Jack"); alert(user.name); // Jack alert(user.isAdmi.. 2020. 12. 7. 자바 스크립트 메서드와 'this' 메서드 만들기 객체 user에게 인사할 수 있는 능력을 부여해 준다. let user = { name: "John", age: 30 }; user.sayHi = function() { alert("안녕하세요!"); }; user.sayHi(); // 안녕하세요! 함수 표현식으로 함수를 만들고 객체 프로퍼티 user.sayHi 에 함수를 할당해 주었다. 객체에 할당된 함수를 호출하면 user가 인사를 해준다. 이렇게 객체 프로퍼티에 할당된 함수를 메서드 라고 부른다. 메서드는 아래와 같이 이미 정의된 함수를 이용해서 만들수도 있다. let user = { // ... }; // 함수 선언 function sayHi() { alert("안녕하세요!"); }; // 선언된 함수를 메서드로 등록 user.say.. 2020. 12. 7. 자바 스크립트 가비지 컬렉션 가비지 컬레겻ㄴ 기준 자바스크립트는 도달 가능성 이라는 개념을 사용해 메모리 관리를 수행한다. 도달 가능한 값은 쉽게 말해 어떻게든 접근하거나 사용할 수 있는 값을 의미한다. 도달 가능한 값은 메모리에서 삭제되지 않는다. 1. 아래 값들은 그태생부터 도달 가능하기 때문에 명백한 이유없이 삭제되지 않는다. - 현재 함수의 지역 변수와 매개변수 - 중첩 함수의 체인에 있는 함수에서 사용되는 변수와 매개변수 - 전역 변수 - 기타 등등 이런 값들은 루트 라고 부른다. 2. 루트가 참조하는 값이나 체이닝으로 루트에서 참조할 수 있는 값은 도달 가능한 값이 된다. 전역 변수에 객체가 저장되어 있다고 가정 이 객체의 프로퍼티가 또 다른 객체를 참조하고 있다면 프로퍼티가 참조하는 객체는 도달 가능한 값이 된다. 이 .. 2020. 12. 6. 자바스크립트 참조에 의한 객체복사 객체와 원시타입의 근본적인 차이 중 하나는 객체는 차몾에 의해(by reference)저장되고 복사된다는 점. 원시값(문자열,숫자,불린값) 은 '값 그래도' 저장 할당되고 복사 let message = "Hello!"; let phrase = message; 두개의 독립된 변수에 각각 문자열 "Hello!"가 저장 변수에는 객체가 그대로 저장되는 것이 아니라 객체가 저장되어있는 메모리 주소인 객체에대한 참조 값이 저장된다. 객체가 할당된 변수를 복사할 땐 객체의 참조 값이 복사되고 객체는 복사되지 않는다. 참조에 의한 비교 객체 비교시 동등 연산자 == 와 일치 연산자 === 는 동일하게 동작한다. 비교시 피연산자인 두 객체가 동일한 객체인 경우에 참을 반환한다. let a = {}; let b = a;.. 2020. 12. 6. 자바스크립트 객체 const user = { name: "John" }; user.name = "Pete"; // (*) alert(user.name); // Pete let user = { // 객체 name: "John", // 키: "name", 값: "John" age: 30 // 키: "age", 값: 30 }; 객체 자바스크립트에는 여덟가지 자료형이 있다. 이주 일곱개는 오직 하나의 데이터(문자열,숫자 등)만 담을수 있어 '원시형' 이라고 부른다. 객체형은 원시형과 달리 다양한 데이터를 담을 수 있다. 키로 구분된 데이터 집합니다 복잡한 개체를 저장할 수 있다. 객체는 중괄호 {...}를 이용하여 만들 수 있다. 중괄호 안에는 "키(key) : 값(value)" 쌍으로 구성된 프로퍼티를 여러개 넣을 수 있는데.. 2020. 12. 4. 자바스크립트 화살표 함수 단순하고 간결한 문법으로 함수를 만들수 있는 방법이 있다. let func = (arg1, arg2, ...argN) => expression 인자arg1,arg2,argN를 받는 함수func이 만들어진다.func는 화살표(=>)우측의 표현식(expression)을 평가하고 평가 결과를 반환한다. let sum = (a, b) => a + b; /* 위 화살표 함수는 아래 함수의 축약 버전입니다. let sum = function(a, b) { return a + b; }; */ alert( sum(1, 2) ); // 3 (a,b) => a+ b 는 인수 a와b를 받는 함수이다. 실행되는 분간 a + b를 평가하고 그겨로가를 반환한다. # 인수가 하나밖에 없다면 인수를 감싸는 괄호를 생략할 수 있다. .. 2020. 12. 4. 자바 스크립트 while 과 for 반복문 for (let i = 0; i < 3; i++) { // 0, 1, 2가 출력됩니다. alert(i); } while(condition){ //코드 // 반복문 본문(body) } contdition 이 true 이면 반복문 본문의 코드가 실행 반복문 본문이 한 번 실행 되는 것을 반복 (iteration, 이터테이션)이라고 부른다. 조건은 while에 의해 평가되고 평가 후엔 불린값으로 변경 #본문이 한줄이면 대괄호를 쓰지 않아도 된다. do..while 반복문 do { // 반복문 본문 } while (condition); 본문이 먼저 실행되고 조건을 확인 true이면 본문이 실행 do...while 문법은 조건이 true 인지 아닌지에 상관없이 본문을 최소한 한번 이라고 실행하고 싶을때만 사용하.. 2020. 12. 4. 자바 스크립트 null 병합 연산자 '??' null 병합 연산자 ?? 를 사용하면 짧은 문법으로 여러 피연산자 중 그 값이 확정되어 있는 병수를 찾을 수 있다. a ?? b 의 평가 결과 - a가 null도 아니고 undefined도 아니면 a - 그 외의 경우는 b ?? 와 || 의 차이 null 병합 연산자는 OR 연산자 || 와 상당히 유사해 보인다 실제로 ?? 를 || 로 바ㅜ꺼도 그 겨로가는 동일하기 까지 하다 차이점 - || 는 첫번째 true 값을 반환 - ?? 는 첫번째 정의된 값을 반환 null 과 undefined 숫자 0 을 구분지어 다뤄야 할 때 이 차이점은 매우 중요한 역할을 한다. let height = 0; alert(height || 100); // 100 alert(height ?? 100); // 0 height .. 2020. 12. 2. 자바스크립트 논리 연산자 자바스크립트에는 세종류의 논리 연산자 ||(OR) &&(AND) !(NOT)가 있다. || (OR) 'OR'연산자는 두 개의 수직선 기호로 만들 수 있다. OR연산자는 불린값을 조작하는데 쓰인다 인수중 하나라도 true이면 true를 반환하고 그렇지 않으면 false 를 반환한다. 자바스크립트 에서만 제공하는 논리연산자OR의 '추가' 기능 result = value1 || value2 || value3; 동작 순서 - 가장 왼쪽 피연산자부터 시작해 오른쪽으로 나아가면 피연산자를 평가 - 각 피연산자를 불린형으로 변환 변환후 그값이 true이면 연산을 멈추고 해당 피연산자의 변환 전 원래 값을 반환 - 피연산자 모두를 평가한 경우(모든피연산자가 false로 평가되는 경우)엔 마지막 피연산자(value3)를.. 2020. 12. 2. 이전 1 2 3 다음