전체 글

GitHub 사용법

로컬 저장소 / 원격 저장소 내 컴퓨터의 로컬 저장소에서 이루어지는 버전관리를 GitHub에 올려서(push) 다른 사람들과 함께 버전관리를 하는 것이 원격 저장소이다. Git 초기설정 Git 처음 설치 시 다음과 같이 설정해주어야 한다. (깃 설치 후 처음 한번만 하면 된다.) git config --global user.name "깃허브이름" git config --global user.emmail "깃헙이메일" 원격 저장소 생성 Github 오른쪽 상단 + 버튼을 통해 New repository 를 통해 새 저장소를 생성한다. New repository : 새 저장소 생성 Import repository : 저장소 불러오기 New gist : 코드 조각을 올리고 싶을 때 new gist 사용 New..

문자열 자르기 substr, substring, slice, split

자바스크립트에서 문자열을 자르는 함수로는 substr, substring, slice, split 이 있다. // [대괄호 부분] 은 생략이 가능하며, 생략할 경우 시작위치부터 문자열 끝까지 자른다. str.substr(start[, length]) str.substring(indexStart[, indexEnd]) str.slice(beginIndex[, endIndex]) str.split([seperator[, limit]]) substr substr 함수는 시작 위치부터 해당 길이만큼 문자열을 자르는 함수이다. 길이 부분을 생략하면 시작위치부터 문자열 끝까지 자른다. substr(시작위치, 길이) 또는 substr(시작위치) var str = '자바스크립트'; var result1 = str.su..

[배열] 10보다 큰 숫자의 갯수를 반환하는 함수

숫자배열이 주어졌을 때 10보다 큰 숫자의 갯수를 반환하는 함수를 만들어보자. 1. forEach function countBiggerThanTen(numbers) { let count = 0; numbers.forEach(n => { if (n > 10) { count++; } }); return count; } const count = countBiggerThanTen([1, 2, 3, 5, 10, 20, 30, 40, 50, 60]); console.log(count); 2. filter function countBiggerThanTen(numbers) { return numbers.filter(n => n > 10).length; } const count = countBiggerThanTen([1..

배열 내장함수

배열을 다룰 때 알고있으면 유용한 내장함수들을 알아보자. forEach for문을 대체시킬 수 있다. const superheroes = ['아이언맨', '캡틴 아메리카', '토르', '닥터 스트레인지']; superheroes.forEach(hero => { console.log(hero); }); forEach 함수의 파라미터로는, 각 원소에 대항 처리하고 싶은 코드를 함수로 넣어준다. 위 함수의 파라미터 hero 는 각 원소를 가리키게 된다. 이렇게 함수 형태의 파라미터를 전달하는 것을 콜백함수라고 부른다. map map 은 배열 안의 각 원소를 변환할 때 사용되며, 이 과정에서 새로운 배열이 만들어진다. map 함수의 파라미터로는 변화를 주는 함수를 전달해준다. 또는 변화 함수를 선언해주지 않아도..

[반복문] 배열을 받아 총합을 구하는 함수

1. numbers 라는 배열을 파라미터로 받아서 총합을 구하는 함수를 만들어보자. function sumOf(numbers) { let sum = 0; for (let i = 0; i < numbers.length; i++) { sum += numbers[i]; } return sum; } const result = sumOf([1, 2, 3, 4, 5]); console.log(result); 2. 숫자로 이루어진 배열이 주어졌을 때, 해당 숫자 배열 안에 들어있는 숫자 중 3보다 큰 숫자로만 이루어진 배열을 새로 만들어서 반환해보자. function biggerThanThree(numbers) { const array = []; for (let i = 0; i < numbers.length; i++..

배열

배열 이전에 배운 객체는 한 변수 혹은 상수에 여러가지 정보를 담기 위함이었다면, 배열은 여러개의 항목들이 들어있는 리스트와 같다. 배열을 선언할 때에는 [ ] 안에 감싸주면 된다. 배열 안에는 어떤 값이던지 넣을 수 있다. n번째 항목 조회하기 objects[n]; 다음과 같이 객체 배열이 있다고 하자. 리스트의 순서는 0부터 시작하기 때문에 첫 번째 항목은 objects[0] 이다. const objects = [{ name: '멍멍이' }, { name: '야옹이' }]; console.log(objects); // 배열 조회 console.log(objects[0]); // 배열 첫번째 항목 조회 console.log(objects[1]); // 배열 두번째 항목 조회 배열에 새 항목 추가하기 배..

getter setter in ES6

본 글은 공부하기 위한 목적으로 포스팅 되었으며 아래 링크의 원문을 참고하였습니다. https://mygumi.tistory.com/161 Getter와 Setter는 대부분 캡슐화, 정보은닉 관점에서 private 개념이 따라오게 된다. 예시로는 private 변수를 지정한 후, 이 변수에 접근하기 위해 getter, setter를 이용한다. 다음 예제를 통해 확인해보자. 1. name을 저장할 때는 정확한 값일 때 저장한다. 2. name을 가져올 때는 대문자로 된 이름을 얻을 수 있다. 위 특징을 가지는 Person 클래스를 만들어보자. class Person { constructor(name, age) { this._name = name; this.age = age; } get name() { r..

객체

객체는 우리가 변수 혹은 상수를 사용하게 될 때 하나의 이름에 여러 종류의 값을 넣을 수 있게 해준다. 객체를 선언할 때에는 { } 안에 원하는 값들을 넣어주면 된다. 값을 집어 넣을 때에는 키: 원하는 값 형태로 넣으며, 키에 해당하는 부분은 공백이 없어야 한다. 만약에 공백이 있어야 하는 상황이라면 이를 따옴표로 감싸서 문자열로 넣어주면 된다. const ironMan = { name: '토니 스타크', actor: '로버트 다우니 주니어', alias: '아이언맨' }; const captainAmerica = { name: '스티븐 로저스', actor: '크리스 에반스', alias: '캡틴 아메리카' }; console.log(ironMan.name); // 토니 스타크 console.log(..

연산자

연산자는 프로그래밍 언어에서 특정 연산을 하도록 하는 문자이다. 산술 연산자 사칙 연산과 같은 작업을 하는 연산자를 의미한다. + : 덧셈 - : 뺄셈 * : 곱셈 / : 나눗셈 ++ : 특정 변수에 1을 바로 더한다. -- : 특정 변수에 1을 바로 빼준다. let a = 1; a++; ++a; console.log(a); // 3 ++ 가 1을 바로 더해주므로 1 + 1 + 1 = 3 이 된다. log 에서 ++ 가 변수 이름 앞에 오는 것과 뒤에 오는 것에는 차이가 있다. let a = 1; console.log(a++); // 1 console.log(++a); // 3 console.log(a++) 를 할 때는 1을 더하기 직전 값을 보여주고 console.log(++a) 를 할 때는 1을 더한..

async function / await

async function 함수이름( ) { } const 함수이름 = async ( ) => { } async function 선언은 Async Function 객체를 반환하는 하나의 비동기 함수를 정의한다. 비동기 함수는 이벤트 루프를 통해 비동기적으로 작동하는 함수로, 암시적으로 Promise를 사용하여 결과를 반환한다. 그러나 비동기 함수를 사용하는 코드의 구문과 구조는 표준 동기 함수를 사용하는 것과 많이 비슷하다. Promise 객체를 리턴하는 함수 await으로 호출하는 방법 // Promise 객체를 리턴하는 함수 function p(ms) { return new Promise((resolve, reject) => { setTimeout(()=> { resolve(ms); }, ms); }..

Promise

Promise Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과값을 나타낸다. ES6부터 Javascript의 표준 내장 객체로 추가되었다. ES6를 지원하는 브라우저나 Node.js에서 전역에 있는 Promise를 확인할 수 있다. 생성자로 프로미스 객체 생성 생성자의 인자로 executor 라는 함수를 이용한다. executor 함수는 resolve 와 reject 를 인자로 가진다. new Promise(/*executor*/ (resolve, reject) => {}); 1. Pending(대기) 상태 생성자를 통해서 프로미스 객체를 만드는 순간 pending (대기) 상태라고 한다. new Promise((resolve, reject) => {}); // pending..

함수

함수 함수는 특정 코드를 하나의 명령으로 실행할 수 있게 해주는 기능이다. 함수를 만들 때는 function 키워드를 사용하며, 함수에서 어떤 값을 받아올지 정해주는데 이를 파라미터(매개변수) 라고 부른다. 차이점: 선언적 함수와 익명함수 변수에 할당 선언적 함수 function hello( ) { } 익명함수를 만들어 변수에 할당 const hello = function ( ) { } 선언적 함수를 통해 호출한 함수는 선언한 함수와 순서 상관없이 호출하면 출력된다. hello1(); function hello1() { console.log('hello1'); } hello1(); // hello1 익명함수를 변수에 할당한 경우에는 var의 hoisting에 의한 문제가 발생한다. console.log(..