본문 바로가기

Programming

[React] 리액트란? 리액트의 4가지 특성 "A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES” "리액트는 유저 인터페이스를 만드는 자바스크립트 라이브러리이다." 나는 문득 리액트가 라이브러리라는 점이 의아했다. 나는 리액트가 자바스크립트의 프레임워크라고 생각했고 꽤 많은 문서에서 리액트를 프레임워크라고 칭하고 있었다. 프레임워크 --(호출)--> 내코드 프레임워크는 뼈대나 구조기반과 같다고 볼 수 있다. 특정 개념을 추상화하는 클래스와 컴포넌트들로 구성되어있으며 해당 클래스나 컴포넌트는 문제를 해결하기 위한 방법을 제공한다. 개발자는 프레임워크에서 정의된 흐름과 규칙에 따라 코드를 작성해야한다. 즉 코드의 흐름에 대한 제어를 프레임워크가 가지고 있는 것이다. 프레임워크를 사용하면 코드의 일관성, 통합성을 .. 더보기
[Javascript] Promise 프로미스를 사용하면 비동기적으로 수행되는 작업의 성공과 실패를 분리해 그에 맞는 처리를 할 수 있게 된다. - 프로미스 생성 let promise = new Promise(function(resolve, reject) { // 실행 코드(성공하면 resolve함수 실행 / 실패하면 reject함수 실행) }); 프로미스 객체는 new Promise() 명령을 통해 생성할 수 있다. 프로미스 생성자의 인자는 반드시 함수(executor)여야하며 이 함수는 프로미스 객체가 생성되면 자동적으로 실행된다. 이 함수의 인자인 resolve, reject함수는 자바스크립트에서 자체적으로 제공된다. resolve함수는 실행 코드가 성공하면 실행시키는 함수이고 reject함수는 실행코드가 실패했을 때 실행시켜야 하는 .. 더보기
[Algorithm] 프로그래머스 - level1 <신규아이디 추천> 문제명 : 신규 아이디 추천 사이트 : 프로그래머스 난이도 : level 1 사용 언어 : javascript 접근 방식 1. 인자로 받은 new_id를 단계별로 수정한다 function solution(new_id) { let newIdArray = []; // 1단계 new_id = new_id.toLowerCase(); newIdArray = [...new_id]; // 2단계 const alphabet = "abcdefghijklmnopqrstuvrwyz".split(""); const number = "0123456789".split(""); const specialCharacter = "-_.".split(""); const availableCharacters = specialCharacter.. 더보기
[Algorithm] 프로그래머스 - level1 <모의고사> 문제명 : 모의고사 사이트 : 프로그래머스 난이도 : level 1 사용 언어 : javascript 접근 방식 1. 학생 각각이 찍을 답을 패턴화한다 2. 학생의 답과 주어진 답을 비교하여 점수를 구한다. 3. 점수가 가장 높은 학생을 배열에 담아 반환한다. function solution(answers) { const result = []; const answersCount = answers.length; const firstAnswers = [1, 2, 3, 4, 5]; const secondAnswers = [2, 1, 2, 3, 2, 4, 2, 5]; const thirdAnswers = [3, 3, 1, 1, 2, 2, 4, 4, 5, 5]; const firstGrade = answers.f.. 더보기
[Algorithm] 프로그래머스 - level1 <폰켓몬> 문제명 : 폰켓몬 사이트 : 프로그래머스 난이도 : level 1 사용 언어 : javascript 접근 방식 1. 주어진 nums 배열에서 nums의 길이 / 2( = maxChoise)만큼의 길이의 배열을 만드는 데 서로 다른 원소를 고를 수 있는 경우의 수가 몇 가지인지 계산 (= countChoise) 2. countChoise가 maxChoise보다 많으면 답은 maxChoise 3. countChoise가 maxChoise보다 적으면 답은 countChoise function solution(nums) { const countNums = nums.length; const maxChoise= countNums / 2; const choise = []; for (let i = 0; i < coun.. 더보기
[JavaScript] 객체 내에 존재하는 속성에 접근하기 자바스크립트에서 속성은 열거가능한(enumerable) 속성과 열거가능하지 않은(non-enumerable) 속성으로 나뉜다. 또한 객체 자신이 소유하고 있는 속성과 부모에게서 상속받은 속성으로도 구분할 수 있다. 메서드에 따라 객체의 속성에 접근할 수 있는 범위가 달라진다. 다음 코드의 예제로 살펴보자. const Person = function (name, height) { this.name = name; this.height = height; this.eye = 2; }; Person.prototype.age = 50; const person1 = new Person("eunbin", 200); person1의 상속받은 속성들은 모두 Person.prototype 객체에서 상속받은 속성들이다. 이 .. 더보기
[Javascript] 프로토타입 Prototype : 원형, 근본 프로토타입이란 어떤 객체를 뜻한다. 그 객체는 다른 객체가 해당 객체의 속성과 메소드를 사용할 수 있는 객체이다. 즉, 프로토타입은 객체와 객체 사이에 상속같은 현상이 일어나 상위 객체의 속성에 접근할 수 있는 것을 뜻하고 이것은 생성자함수와 new키워드를 통해 구현된다. 우선 프로토타입이 왜 필요한지 알아보자. 예를 들어 여러 개의 책의 정보를 저장하는 객체들을 만든다고 가정해보자. book1 = { name: "어린왕자", publisher: "우리출판사", displayInfo: function () { return "책 제목: " + name + "출판사: " + publisher; }, }; book2 = { name: "죄와벌", publisher: "하나출판.. 더보기
[JavaScript] sort() 메소드를 이용한 배열 정렬 dudmy.net/javascript/2015/11/16/javascript-sort/ 자바스크립트 정렬 함수, sort() - Dudmy's Devprint 자바스크립트 배열의 내장 함수에 sort()가 있다. 명칭 그대로 배열 안의 원소를 정렬하는 함수이다. 추후에 또 검색할 것 같아서 적어놓는다. arrayobj.sort(sortFunction) arrayobj는 임의의 Array 개체이 dudmy.net 자바스크립트에서 sort()메소드를 사용해 배열을 정렬할 수 있다. array.sort([compareFunction]); conpareFunction은 생략 가능하며 생략하면 기본적으로 유니코드를 기준으로 정렬한다. 문자열 요소의 배열을 정렬하는 경우 ) const stringArray = [".. 더보기

티스토리툴바