web study

깃허브에 push 시 user name과 user password를 요구하는 경우가 있다. 깃허브 계정 아이디와 비번을 올바르게 입력했는데도 아래와 같은 권한 오류가 뜰 경우 해결방법에 대해 알아보도록 하겠다. fatal: Authentication failed 우선 문제가 발생할 수 있는 경우를 체크해보자. 1) user name(ID), user password를 제대로 작성했는가? - 오른쪽 상단 프로필 이미지를 클릭하면 아이디를 확인할 수 있다. 2) Personal Access Tokens(2차 인증 토큰) 발행 유무 config 초기화하는 방법은 소용없다. 아이디와 비밀번호를 정상적으로 입력했는데도 오류가 뜬다면, 2차 인증 토큰을 생성하지 않았을 가능성이 크다. 아래 페이지에 접속하여 토큰이..

Homebrew는 무엇인지 알아보고, 맥에 설치해보도록 하겠다. 설치하기에 앞서 필자의 macOS 버전은 Catalina 10.15.7이다. 목차 Homebrew란? Homebrew 설치 1. Homebrew란? 패키지를 편리하게 설치/제거할 수 있는 MacOS용 패키지 관리자이다. 터미널을 사용하기 때문에 익숙하지 않을 뿐이지 사용해보면 정말 편리하다. App store를 통해 여러 가지 프로그램을 설치할 경우 삭제하더라도 기존 데이터가 남아있는 경우가 있다. Homebrew를 사용하는 이유는 이러한 잔존 데이터가 남지 않게 설치/삭제/업데이트할 수 있기 때문이다. 2. Homebrew 설치 맥의 터미널을 통해 Homebrew를 설치해보도록 하겠다. 1) Homebrew 사이트에 접속한다. https:..

다양한 메서드를 활용하여, 배열에 담긴 문자열을 길이 순서로 정렬 후 오른쪽 정렬하여 출력해보자. 1 const strings = ['very very long string', 'creative', 'hello world']; cs 길이가 다양한 문자열이 담긴 배열이 있다. sort() 메서드를 사용하여 문자열 길이의 내림차순으로 정렬해준다. (sort()의 자세한 설명은 여기) 1 2 3 const strings = ['very very long string', 'creative', 'hello world']; const sorted = strings.sort((a, b) => b.length - a.length); // 내림차순 정렬 ['very very long string', 'hello worl..

함수의 arguments에 대한 개념과 활용에 대해 알아보도록 하겠다. 목차 arguments 개념 화살표 함수에서의 arguments arguments를 배열로 변형 arguments 활용 1. arguments 개념 자바스크립트에서 전달된 인수와 매개변수의 개수는 서로 같지 않아도 된다. 매개변수의 개수보다 인수가 더 적을 경우 넘어오지 않은 값은 undefined로 표시된다. 매개변수 개수보다 초과된 인수는 무시된다. 1 2 3 4 5 6 7 8 function print(ar1, ar2) { console.log(ar1, ar2); } print(); // undefined undefined print('a'); // a undefined print('a', 'b'); // a b print('a..

기존 프로토타입 방식으로 클래스를 생성하는 방법과 ES6의 class를 비교하며 자세히 알아보도록 하자. 목차 프로토타입 방식으로 클래스 만들기 ES6 class 1. 프로토타입 방식으로 클래스 만들기 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 // 클래스 생성자 function User(name, age) { // 프로퍼티 정의 this.name = name; this.age = age; } // 메서드 정의 User.prototype.showInfo = function() { console.log("User name: " + this.name); console.log("User age: " + this.age); } // 인스턴스 생성 const use..

자바스크립트에서 객체란, 숫자, 문자열, 불 값, null, undefined를 제외한 모든 값이다. 객체는 실제 값이 아닌 참조하는 값으로 처리된다. 따라서 객체는 참조를 가지고 있다고 말할 수 있다. 목차 Set() WeakSet() 1. Set() Set() 메서드는 주로 배열의 중복 값을 제거하기 위해 사용된다. 예약어 new와 같이 작성한다. 1 2 3 4 5 6 7 8 9 const array = [1, 2, 3, 1]; const set = new Set(array); console.log(set); // {1, 2, 3} console.log(toString.call(set)); // [object Set] const newArray = [...set]; // 스프레드 문법 사용하여 객체로..

배열에 중복된 요소가 있는지 확인 후 제거하여 새 배열로 출력하는 여러 가지 방법에 대해 알아보자. 목차 Set() filter() + indexOf() forEach() + includes() 1. Set() 중복된 값이 있는 배열을 new Set() 메서드를 활용하여 중복 값을 제거한다. 중복은 제거됐지만 배열이 아니기 때문에, 배열 형태로 변형하는 과정이 필요하다. '...' 연산자를 사용하는 스프레드 문법을 통해 객체로 변형해준다. 1 2 3 4 5 6 7 8 9 const array = [1, 2, 3, 1]; const set = new Set(array); console.log(set); // {1, 2, 3} console.log(toString.call(set)); // [object S..

구조분해 할당(Destructuring Assignment)에 대한 자세한 내용은 아래 페이지에서 확인할 수 있다. [Javascript] 구조분해 할당(destructuring assignment) ES6부터 구조분해 할당(destructuring assignment)이라는 문법이 등장했다. 말 그대로 어떤 배열이나 객체를 분해한 후 다시 할당하는 것이다. ES5와 ES6를 비교하며 알아보자. 목차 배열 구조분해 할당 객 fromnowwon.tistory.com 구조분해 할당을 활용하여 클릭한 객체의 정보를 전달받을 수 있다. 그 이벤트 객체 내의 정보만 따로 출력할 수도 있다. 아래에서 살펴보자. 1234567891011121314151617181920212223242526272829303132333..

자바스크립트에는 배열 형태이지만 배열이 아닌 것들이 꽤 있다. 이 경우 배열로 어떻게 변환할 수 있는지 알아보도록 하자. arguments를 사용했을 경우, 배열이 아니지만 형태만 배열인 객체를 출력한다. 배열이 아니기 때문에 map() 배열 메서드를 사용하면 아래처럼 오류가 뜬다. 1 2 3 4 5 6 7 8 9 10 function addTxt () { let newData = arguments.map((value) => { return '#' + value; }); console.log(newData); // Uncaught TypeError: arguments.map is not a function } addTxt(1, 2, 3, 4, 5); Colored by Color Scripter cs 그..

반복적인 동작을 하는 forEach() 메서드, for in 문, for of 문의 특징과 차이점에 대해 알아보도록 하겠다. 목차 forEach() for in 문 for of 문 1. forEach() forEach() 함수는 반복문 기능을 지닌 배열 메서드이다. 배열을 순회하며 모두 순회하면 실행을 멈춘다. 1 2 3 4 5 6 7 8 9 10 11 12 const data = [1, 3, null, undefined, NaN, ""]; data.forEach(item => { console.log(item); }); // 1 // 3 // null // undefined // NaN // Colored by Color Scripter cs [Javascript] 반복문 for, forEach, ma..