목록WEB/HTML CSS JS (22)
개발로그필름
Destructuring(구조 분할)은 배열의 원소나 객체의 property를 추출해서 변수에 저장할 수 있도록 해줍니다 앞서 포스팅했던 spread 연산자와 같은 것이라고 생각할 수 있는데 다른 개념입니다 spread는 모든 원소와 property를 가져와 새 배열이나 객체에 전달하는 연산자입니다 하지만 destructuring은 원소나 property를 하나만 가져와서 변수에 저장해요 배열과 객체를 예를 들어보면 배열 [a, b] = ['Hello', 'Max'] console.log(a) // Hello console.log(b) // Max 객체 {name} = {name : 'Max', age : 28} console.log(name) // Max console.log(age) // undefi..
사용하는 곳에 따라 spread 또는 rest 연산자라고 부릅니다! 점 3개로 이루어진 연산자 ( ... ) 에요~ Spread 연산자 배열의 원소나 객체의 property를 나누는데 사용돼서 배열이나 객체를 펼쳐 놓습니다 예를 들어 oldArray 배열에 있는 모든 원소들을 새로운 배열에 추가하고 원소 1, 2를 더 추가하고 싶으면 const newArray = [ ...oldArray, 1, 2] 객체의 경우도 마찬가지로 newProp과 함께 중괄호를 사용해서 새 객체를 만드는데 ...oldObject로 oldObject의 모든 property와 값을 꺼내서 새 객체의 키 값으로 추가합니다 const newObject = { ...oldObject, newProp : 5 } const numbers ..
클래스는 객체를 위한 핵심 청사진과 같다고 비유할 수 있습니다! class Person { name = 'YuJung' // Property call = () => { ... } // Method } class 키워드를 통해 정의하고 클래스 안에는 property(변수)과 method(함수)를 정의할 수 있어요 new 키워드로 클래스의 인스턴스를 생성합니다! const myPerson = new Person() myPerson.call() console.log(myPerson.name) 클래스는 생성자 함수를 만드는 좀 더 편한 방법이고 클래스를 가지고 자바스크립트 객체를 생성하거나 상속을 할 수도 있어요 extends 키워드를 사용해서 상속합니다 class Person extends Human 다른 클..
차세대 자바스크립트에는 모듈 방식으로 코드를 작성해 여러 개의 파일로 코드를 분할할 수 있습니다~ 사용하는 방법은 !! 코드를 여러 파일로 만들어두고 작동하는 main 파일에 올바른 순서대로 코드를 가져오기만 하면 됩니다 아주 쉽지요!!?? 파일끼리의 export, import 하는 간단한 코드를 구현해 보았어요 person.js const person = { name : 'YuJung' } export default person 다른 파일에서 import 할 수 있게 하려면 내보내려는 파일 맨 밑에 default를 붙여 내보낼 수 있습니다 export default에 붙은 값이 기본값입니다! 다른 파일에서 person.js를 import 하면 원하는 대로 객체 이름을 변경할 수 있어요 utility.j..
자바스크립트 함수를 생성하는 구문에는 여러 방법이 있는데요! 일반적인 자바스크립트 함수 function printMyName(name) { console.log(name); } printMyName('YuJung'); 화살표 함수 const printMyName = name => { console.log('name'); } printMyName('YuJung'); const printMyName = () => { console.log(); } printMyName('YuJung'); const multiply = number => number * 2; console.log(multiply(2)); function 키워드를 생략해서 일반적인 함수보다 짧은 구문으로 정의할 수 있고 키워드 this를 사용할 ..
map()백준 문제를 풀다가 map(Number) 메서드를 사용해야 하는 문제를 풀게 되면서 어떤 메서드인지 공부해보았다 js에서 입력받은 문자열을 숫자로 변환시킨뒤 새로운 배열을 만들기 위해 사용하는데 .map(Number)을 하면 한 번에 숫자형 배열을 만들 수 있다 map()은 배열 내 모든 요소에 함수를 적용시켜 도출된 새로운 결과 배열을 리턴한다 예제 1숫자 배열을 .map() 메서드를 이용해 각각의 배열 요소에 7을 곱한 값을 출력하는 새로운 배열을 출력하였다 예제 2문자열 배열에 .map(Number) 메서드를 적용시켜줌으로써 숫자 배열이 출력되게 하였다