본문 바로가기

반응형

분류 전체보기

(104)
자바스크립트 중급 3- 객체 메소드(Object methods), 계산된 프로퍼티(Computed property) *Computed property(계산된 프로퍼티) let a = 'age'; const user = { name : 'Gangmi', [a] : 30 //age: 30 [a] = 변수 a 에 할당된 값 age } *식 자체를 넣는 것도 가능 const user = { [1 + 4] : 5, ["안녕"+"하세요"] : "Hello" } *객체 메소드 1)Object.assign(): 객체 복제 const user = { name : 'Mike', age : 30 } const newUser = Object.assign({}, user); {}: 빈 객체= 초기값, 두번째 매개변수부터 들어온 객체들이 초기값에 병합. {} + {name : 'Mike', age : 30} = { name : 'Mike', ..
자바스크립트 중급 2 - 생성자 함수 객체 리터럴 let user = { name : 'Mike', age : 30, } 생성자 함수 → 비슷한 객체 여러개 생성하기 위한 함수 function User(name, age){ //첫글자는 대문자로 this.name = name; this.age = age; this.sayName = function(){ console.log(this.name); } } let user1 = new User('Mike', 30); //new 연산자를 사용해서 호출 let user2 = new User('Jane', 22); let user3 = new User('Tom', 17); let user5 = new User('Han', 40); user5.sayName(); //"Han" new 함수명(); → th..
자바스크립트 중급 1- 변수, 호이스팅, TDZ(Temporal Dead Zone) *변수 : let , const : -es6부터 생김. var: -es6이전 버전에서 사용. -var와 let은 크게 다르지 않음. 둘이 바꿔서 사용해도 됨. -var는 한번 선언된 변수를 다시 선언할 수 있다. (let은 한번 선언된 변수 다시 선언x) var name = 'Mike'; console.log(name); //Mike var name = 'Jane'; console.log(name); //Jane -var는 선언하기 전에 사용할 수 있다. console.log(name); //undefined var name = 'Mike'; 왜냐하면 이렇게 동작하므로 ↓ var name; → 코드가 실제로 위로 이동하진 않지만 끌어올려진 것 처럼 동작(호이스팅) console.log(name); //u..
자바스크립트 기초 강좌 14 -배열(Array) *배열(Array) : 순서가 있는 리스트 1번- 철수, 2번- 영희, ,,,, ,30번- 영수 → let students = ['철수', '영희',,,,'영수'] index(고유번호) : 0부터 시작 0 1 ...29 console.log(students[0]); //철수 students[0] = '민정'; → 0번째 학생을 철수 대신 민정으로 바꿈 console.log(students) // ['민정','영희',,,,] *배열의 특징 -배열은 문자 뿐 아니라 숫자, 객체, 함수 등도 포함 -length : 배열의 길이 (배열이 가지고 있는 요소의 개수) -push() : 배열 끝에 추가 let days = ['월', '화', '수']; days.push('목') console.log(days) // ..
자바스크립트 기초 강좌 13- 객체(Object)-method, this const superman = { name : 'clark', age : 33, fly : function(){ fly(){ console.log('날아갑니다.') → console.log('날아갑니다.') } } →단축 가능 } superman.fly(); → method: 객체 프로퍼티로 할당 된 함수 (fly함수가 슈퍼맨 객체의 method) *객체와 method의 관계 const user = { name : 'Mike', sayHello : function(){ console.log(`Hello, I'm ${this.name}`); } } user.sayHello(); //Hello, I'm Mike ( user = this ) let boy = { name : 'Mike', sayHello, }..
자바스크립트 기초 강좌 12- 객체(Object) const woman = { name : 'kangmi', name, age - 키(key) / kangmi, 27 - 값(value) age : 27, → property : 각 property는 쉼표(,)로 구분. } (마지막property에는 없어도 되지만 있는게 수정할 때 좋음.) ●Object- 접근, 추가, 삭제 woman.name //'kangmi' woman['age'] //27 woman.gender = 'female'; woman['hairColor'] = 'black'; delete woman.hairColor; ●Object- 단축 프로퍼티 const name = 'kangmi'; const age = 27; ↓ const woman = { name, //name : name age..
자바스크립트 기초 강좌 11- 함수 표현식, 화살표 함수(arrow function) 함수 선언문: 어디서든 호출 가능 function sayHello(){ console.log('Hello'); } sayHello(); → 선언문 맨 위에 위치해도 똑같이 동작함. javascript는 위에서 아래로 순차적으로 실행되며, 즉시 결과를 반환하는 프로그래밍 언어=인터프리터 언어(Interpreted language) 호이스팅: 실행 전 코드의 모든 함수 선언문을 저장해서 생성해놓음. → 이로 인해 선언문의 위치에 상관없이 동일하게 실행. vs 함수 표현식 let sayHello = function(){ console.log('Hello'); } sayHello(); → 함수 표현식은 함수를 한 줄씩 읽어내려가므로 그 이후에 선언될 때만 사용가능. 함수 선언문을 사용하는 게 더 자유롭고 편함...
자바스크립트 기초 강좌 10- 함수(function)의 기초 함수(function);중복되는 구문을 반복할 때 간단하게 나타낼 수 있음. function sayHello(name){ 함수 함수명 (매개변수) → 매개변수는 없을수도 있고, 한 개 또는 두개 이상 일 수도 있다. (두 개 이상 = 쉼표로 구분) console.log(`Hello, ${name}`); → 함수의 실행코드 } sayHello('Mike'); → 함수명 뒤에 괄호를 붙여 호출 가능 (매개변수는 괄호 안에) function sayHello(name){ const msg = `Hello, ${name}`; console.log(msg); } sayHello('Mike'); →"Hello, Mike" function sayHello(name){ let msg = `Hello`; //변할 수 있기..