목록 개발기록/Javascript (51)
네이처리 노트
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 상속을 보기전에 프로토타입에 대해 이해해야함 ▶ 프로토타입 먼저보기 classical 방식은 new 연산자를 통해 생성한 객체를 사용하여 코드를 재사용하는 방법 → java 방식 prototypal 방식은 리터럴 또는 Object.create()를 이용하여 객체를 생성하고 확장해 가는 방식 → js 선호 기본방법 function Person(name){ this.name = name || "네이처리"; } Person.prototype.getName = function(){ return this.name; } function Korean(name){} Korean.prototype = new Person(); let kor1 = n..
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 function Person() { this.name = "annonymous"; this.sayHello = function() { console.log("Hello, my name is" + this.name); } } function Yoda() { let obj = new Person(); obj.name = "Yoda"; return obj; } let uuu = new Yoda(); uuu.sayHello(); // Hello, my name isYoda console.log(uuu instanceof Yoda); // false console.log(uuu instanceof Person); // true ▲ uuu의 ..
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 Javascript는 클래스라는 개념이 없었다. (ES6버전부터 등장) 그래서 기존의 객체를 복사하여 새로운 객체를 생성하는 프로토타입 기반의 언어 함수와 객체의 내부구조 Person 함수의 prototype속성 ↔️ Person prototype 객체(원형)의 constructor속성 각 속성은 함수와 객체를 참조하는 내부구조를 갖는다. function Person(){} let joon = new Person(); let jisoo = new Person(); ▼new를 적용하지 않을 경우 function A(){} let a = new A(); let b = A(); console.log(a); // A{} prototype ..
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 클로저 너무 어려워 ㅠㅠ 지역변수를 참조하는 내부함수를 외부에 전달했기에 클로저라 할 수 있다. 사실 굳이 정확히 따져보면 클로저는 특정 상황에서 발생하는 ‘현상’이고 함수는 이 현상이 나타나기 위한 ‘조건’에 해당한다고 볼 수도 있겠다. 지역변수를 참조하는 내부함수를 외부에 전달했기에 클로저는 맞지만, 외부로 전달이 항상 return을 의미하는 것은 아니라는 정도로 생각하기! function outerFn() { let x = 10; return function innerFn(y) { // innerFn 함수는 클로저다. return x = x + y; } } let a = outerFn(); // 외부함수 호출은 한번만. 이제 ..
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 함수 내부에서 명령을 실행한 후에 값을 반환한다. function getTwo(num = 0){ // num의 default값을 설정할 수 있다. return num + 2 ; console.log('리턴이 사용된 후에는 함수실행이 종료된다.'); //dead code } let index = getTwo(); console.log(index); // 2 console.log(getTwo(4)); // 6 function getTwo(num = 0){ console.log('리턴되기전에는 출력됨'); return num + 2 ; } let index = getTwo(); console.log(index); // 리턴되기전에는 출력..
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 매개변수 Parameter function welcome(name) { console.log('안녕하세요 ' + name + '님'); }; welcome('네이처리'); // 안녕하세요 네이처리님 기본인자 function welcome(name="기본인자") { console.log('안녕하세요 ' + name + '님'); }; welcome(); // 안녕하세요 기본인자님 옵셔널 파라미터 optional parameter 여러개의 파라미터중 하나의 옵셔널 파라미터는 맨 마지막에 위치한다. function intro(name, age, nationality = '한국'){ console.log(`이름은 ${name},`); co..
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 선언방식 function greetings() { console.log('Hi'); }; greetings(); // Hi 출력 ▲선언식 ▼표현식 let greetings = function() { console.log('Hi'); }; greetings(); // Hi 출력
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 데이터 타입 숫자형 // 나머지 값 console.log(7 % 3); // 1 // 거듭제곱 console.log(2 ** 3); // 2x2x2 = 8 // 사칙연산 console.log(2 + 3 * 2); // 8 console.log((2 + 3) * 2); // 10 문자열 console.log(7); console.log(3.14); console.log('작은 따옴표 문자열'); console.log("큰 따옴표 문자열"); console.log('I'm fine'); //따옴표 오류 console.log("I'm fine"); //따옴표 변경 console.log("He said "I'm fine" "); //따옴표..
공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 세미콜론 문장과 문장이 연결되는 경우, 세미콜론을 사용하여 문장의 끝을 알린다. 문장 끝에 반드시 사용하면 오류를 최소한 할 수 있다. // 다른 라인을 사용하여 세미콜론이 필요 없는 경우! 정상작동 console.log('1') console.log('2') // 한 라인에서 세미콜론 없는 경우! 오류발생 console.log('1')console.log('2') // 한 라인에서 세미콜론 사용한 경우! 정상작동 console.log('1'); console.log('2') 주석 어떤 의도로 코드가 작성 되었는지 설명하거나 구현한 코드가 어떤 동작을 하는지 기록할 때 단축키 ctrl +/ // 하나의 라인에 주석을 사용 /* 여러..
ES6 버전으로 공부했지만 이전 버전으로 개발된 프로그램 유지보수를 위해서 짧게나마 찾아본 내용입니다 알면 알수록 var 가 싫어진다.. var (variable) 변수선언 var myVariable; myVariable = 'codeit'; var myVariable = 'codeit'; 중복선언 허용 똑같은 이름으로 변수를 한 번 더 선언하게 되면, 에러가 발생하는 것이 아니라 그냥 기존의 변수를 덮어써 버리는 것이죠. let 변수에 값을 재할당하는 것과는 엄연히 다릅니다. (?) 함수스코프 ES6부터 등장한 let과 const는 코드 블록을 기준으로 적용되는 스코프를 블록 스코프 let이나 const의 경우에는 중괄호로 감싸진 경우라면 모두 중괄호 밖에서는 지역 변수에 접근할 수 없습니다. var는..