본문 바로가기

728x90

Web/JavaScript

(15)
[JS] 수학, 숫자 메소드 toString() 10진수 -> 2진수/16진수 let num = 10; num.toString() //"10" num.toString(2); //"1010" let num2 = 255; num2.toString(16) //"ff" Math.PI; 3.141592... Math.ceil(): 올림 let num1 =5.1; let num2 = 5.7; Math.ceil(num1); // 6 Math.ceil(num2); // 6 Math.floor(): 내림 let num1 =5.1; let num2 = 5.7; Math.ceil(num1); // 5 Math.ceil(num2); // 5 Math.round(): 반올림 let num1 =5.1; let num2 = 5.7; Math.ceil(num1..
[JS] 심볼 property key: 문자형 Symbol 심볼은 유일한 식별자를 만들 때 사용 const a = Symbol(); const b = Symbol(); a == b // 생긴건 똑같지만 false 발생 유일성 보장 const id = Symbol('id'); //설명을 붙일 수 있음 const user = { name: 'Mike', age: 30, [id]: 'myid' } //{name: "Mike", age: 30, Symbol(id): "myid"} 그러나 Object.keys(user); 작성시 ["name", "age"]만 발생 values, endries도 건너뜀 Symbol.for(): 전역 심볼 하나의 심볼만 보장받을 수 있음 없으면 만들고 있으면 가져오기 때문 Symbol함수는 매번 ..
[JS] 객체 메소드, 컴퓨티드 프로퍼티 Computed property let a = 'age'; const user = { name: 'Mike', age: 30 } const user = { name: 'Mike', [a]: 30 //이런식으로 묶어줄 시 변수 a에 할당된 값이 들어감 } const user = { [1 + 4] : 5, ["안녕" + "하세요"] : "Hello" } // 이런식으로 식 자체를 넣는 것도 가능함 Methods Object.assign(): 객체 복제 const user = { name: 'Mike', age: 30 } 이런 객체가 있을 때 const cloneUser = user; 작성 시 객체가 복제 될까? 정답은 X user변수에는 객체 자체가 들어가있는게 아니라 객체에 대한 참조값이 저장되어 있음 동..
[JS] 생성자 함수 객체 리터럴 let user = { name: 'Mike', age: 30, } 그러나 개발을 하다보면 이렇게 비슷한 객체를 여러개 만들어야되는 상황이 생김 그럴 때 쓰는 것이 생성자 함수 생성자 함수는 보통 첫글자를 대문자로 생성 function User(name, age) { this.name = name; this.age = age; } let user1 = new User('Mike', 30); let user2 = new User('Jane', 22); let user3 = new User('Tom', 17); 생성자 함수는 붕어빵틀이나 와플틀이라고 생각하면됨 필요한 재료를 넣고 만들어줌 new 함수명() 실행시 빈 객체를 만들고 this에 넣음 이후 변수들을 넣어주고 this를 반환 메소드 추..
[JS] 변수 심화 var는 한번 선언된 변수를 다시 선언할 수 있다 var는 선언하기 전에 사용할 수 있다. 아래 선언되어있어도 상위에 선언된걸로 인식됨(호이스팅) console.log(name); var name = Mike; 호이스팅: 스코프 내부 어디서든 변수 선언은 최상위에 선언된것처럼 행동 TDZ: Temporal Dead Zone TDZ영역에 있는 변수들은 할당 전 사용할 수 없음 let age = 30; function showAge() { console.log(age); let age = 20; //문제 발생 } showAge(); 변수 생성과정 var 1. 선언 및 초기화 단계 2. 할당단계 var은 선언과 초기화가 동시에 이루어짐 let 1. 선언단계 2. 초기화단계 3. 할당단계 let은 따로 이루어짐..
[JS] 배열 배열 let students = ['철수', '영희', ... '영수']; 특징 배열은 문자 뿐만 아니라, 숫자, 객체, 함수 등도 포함할 수 있음 let arr = [ '민수', 3, false, { name: 'Mike', age: 30, }, function() { console.log('TEST'); } ]; length: 배열의 길이 students.length //30 push(): 배열 끝에 추가 pop(): 배열 끝 요소 제거 shift, unshift: 배열 앞에 제거/추가 반복문:for let days['월', '화', '수']; for(let index = 0; index < days.length; index++) { console.log(days[index]); } 반복문:for....
[JS] 객체 //Superman //name: clark //age: 33 const superman = { name: 'clark', age:33, } 객체 접근, 추가, 삭제 접근 superman.name superman['age'] 추가 superman.gender = 'male' superman['hairColor'] = 'black' 삭제 delete superman.hairColor 단축 프로퍼티 예를 들어 const name = 'clakr'; const age = 33; const superman = { name: name, age: age, gender: 'male', } 이런 객체가 있을 시 const superman = { name, age, gender: 'male', } 로 변경 가능 만약 존..
[JS] 함수2 함수 선언문 function sayHello() { console.log('Hello'); } 함수 표현식 let sayHello = function() { console.log('Hello'); } 두 개의 차이는 함수를 호출 할 수 있는 타이밍 함수 선언문은 어디서든 호출 가능 예를 들어 sayHello(); function sayHello() { console.log('Hello'); } 이런식으로 작성해도 실행 가능 자바 스크립트는 위에서 아래로 실행되는데 어떻게 실행되는가? 자바 스크립트는 실행 전 코드의 모든 함수를 모아서 모아둠 이를 바탕으로 코드 실행범위가 넓음 이를 호이스팅이라고 함 함수 표현식은 코드에 도달하면 생성되어 선언된 이후에만 사용 가능 화살표 함수 let add(num1, n..

728x90