목록JavaScript (33)
미누에요

Ajax(Asynchronous Javascript and XML) Ajax는 JavaScript를 통해 브라우저가 비동기(Asynchronous) 방식으로 데이터를 교환할 수 있도록 하는 기능이다.이를 이해하기 위해 우리는 동기 방식(Synchronous)과 비동기 방식(Asynchronous) 에 대해 알아야한다. 동기 방식(Synchronous) 작업 순서가 차례대로 진행된다.하나의 작업이 완료될 때까지 기다린 후, 다음 작업을 실행한다.처리 흐름이 직선적이고 예측 가능하지만, 대기 시간이 길어질 수 있다. 일반적으로 일이 진행중일 때 기다리는 방식이다. 직관적이고 구현이 간단하다는 장점이 있지만, 작업이 오래걸릴 경우 뒤의 사람이 계속 기다려야 한다는 단점이 존재한다. 비동기 방식(Asy..

자바스크립트(JavaScript)자바스크립트는 HTML, CSS와 함께 웹 개발에서 사용되는 구성요소이다.또한 자바스크립트는 웹 브라우저에서 동작하는 유일한 프로그래밍 언어이다. (HTML, CSS는 프로그래밍 언어가 아니다!!!!!!!!!!!)자바스크립트는 인터프리터 언어다. 인터프리터 언어(Interpreter Language)코드가 실행되는 단계인 런타입에 문 단위로 한줄씩 바이트코드로 변환 후 실행 또한 자바스크립트는 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍 방식을 지원하는 멀티 패러다임 프로그래밍 언어이다.전통적인 객체지향 언어와는 차이가 있지만 자바스크립트는 강력한 객체지향 방식을 지원한다. 심지어 ES6부터는 class를 지원하여 더 객체지향 프로그래밍답게 코드를 작성할 수 있..
JavaScript에서는 true처럼 쓸 수 있는 Truthy와 False처럼 쓸 수 있는 Falsy라는 값이 존재한다. JavaScript는 boolean 값에서 형변환을 지원하기 때문에, Truthy한 값들은 true로, Falsy한 값들은 false로 변환된다. Truthy undefined null 0 -0 NaN // Not a Number "" 0n // 큰 수를 나타낼 때 사용 위와 같은 값들은 true와 비슷한 맥락으로 사용될 수 있다. Falsy "hello" 123 [] {} ()=>{} 위와 같은 값들은 Falsy한 값들으로, false로 변환되어 사용된다.

.every() every 메서드는 배열과 함께 사용되며, true 혹은 false를 반환한다. arr.every(실행할 함수) 기본적인 형태는 위와 같으며, 실행할 함수를 먼저 선언하여 콜백형식으로 사용하거나, every() 메서드의 인자로 직접 함수를 정의해주는 방법이 있다. every() 메서드는 배열의 각 값을 불러와 함수로 검사하여 모든 결과가 참일 경우에 참을 반환한다. 1. 함수를 따로 선언하여 콜백형태로 every() 매서드에 사용 let arr = [3, 4, 5, 6, 7, 8, 9, 10]; function biggerThanFive(num) { if (num > 5) { return num; } } const result = arr.every(biggerThanFive); conso..

.some() some 메소드는 JavaScript의 내장 함수로, 배열과 함께 사용된다. arr.some(실행할 함수) some() 메서드는 함수를 통해 배열을 순차적으로 검사한다. for~in 문처럼 자동적으로 배열의 각 값이 하나하나 검사되는 형식인 셈이다. some() 메서드의 특징은 배열의 값들 중 하나만 함수의 조건을 만족한다면, (배열값으로 함수를 실행했을 때 하나라도 참인 게 있다면) 결과는 true 가 나온다. 그리고 some() 메서드는 기본적으로 위의 형식을 가지고 있으며, 함수의 표현방식에 따라서 형태가 조금씩 달라진다. 1. 함수를 따로 정의하고 콜백함수 형식으로 some을 실행하는 경우 function isEven(num) { // 함수 선언 if (num % 2 === 0) {..

익명함수(Anonymous Function) 함수를 정의할 때, 이름을 붙이지 않고 사용하는 때가 있다. 그럴 때 사용하는 이름없는 함수가 바로 익명함수(Anonymous Function)이다. 주로 재사용하지 않고, 한번만 사용할 목적으로 생성한다. function () { console.log("HI!") } 기본적으로 위와 같이 사용한다. 함수 이름이 function 과 () 사이에 있어야 하지만, 익명함수는 이름이 없는 함수이므로 없다. 위 코드를 실행하면, 함수의 이름이 필요하다는 오류가 발생한다. 따라서, 익명함수를 사용하려면 아래 두 가지 방법을 사용해야한다. 1. 소괄호(()) 로 감싸기. 소괄호로 익명함수 전체를 감싸는 방법이다. (function () { console.log("HI!"..
Arrow Function(화살표 함수) 화살표 함수(Arrow Function) 형태는 JavaScript에서 흔히 보이는 함수의 선언 형태이다. 기본 함수 선언식 우선, 기본적으로 함수를 선언할 때 우리는 아래와 같은 형식을 사용한다. function add(a,b){ return a+b; } 위 함수는 a와 b를 더하는 함수이다. const add = function (a, b) { return a + b; } 그리고 함수는 객체임을 생각한다면 add라는 변수에 a와 b를 더하는 익명함수를 저장해주는 방식으로도 선언할 수 있다. 위의 함수 선언과 동일한 결과를 나타낸다. 여기서 익명함수는 아래 게시글을 참고하면 좋을 거 같다. [JavaScript] 익명함수(Anonymous Function) 익명..

Array.prototype.map(실행할 함수) map() 메서드는 배열에 붙여 사용하며, 배열의 각 요소를 불러와 괄호 안의 내용을 수행하고 반환하여 새로운 배열을 만든다. 즉, return 값이 있다. 예시를 보자. 배열과 map() const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; const map = numbers.map(function (number) { return number * 3; // 3을 곱한 값을 반환 }) console.log(map); 위 코드는 1부터 10까지의 숫자가 배열로 담긴 numbers를 map을 사용하여 각 값에 3을 곱한 값을 반환하도록 하는 함수이다. 결과를 보면 map이라는 변수에 3이 곱해진 값들이 정상적으로 들어가있는 ..

생성자는 객체를 만드는 역할을 한다. function a() { } let ab = a(); console.log(ab); 예를 들어, 위와 같이 a라는 함수가 존재하고, 그 함수를 ab라는 변수에 넣는다고 하자. ab를 출력하면 , 우리의 의도대로 객체 a 가 들어있어야 한다. 결과 하지만 결과는 undefined가 나온다. 왜냐하면 a 함수는 현재 아무 반환값(return)을 가지고 있지 않기 때문이다. 변수에 우리가 만든 함수(객체)를 넣고 싶을 때, 우리는 생성자인 new를 사용할 수 있다. function a() { } let ab = new a(); // new 생성자 추가 console.log(ab); 위처럼 new 생성자를 사용하여 객체를 추가해주면, new 생성자가 객체를 임의로 하나 생..

사용할 함수.call(this, 사용할 함수의 첫번째 인자, ..., 사용할 함수의 N번째 인자) B라는 함수에서 A객체의 내용을 호출할 때 사용한다. 다시 말해서, 함수 밖의 객체를 함수로 불러와 사용할 때, 사용한다. 인자들은 사용할 함수의 형식을 따른다. 전달할 객체가 없는 경우에는 null, undefined를 넣는다. const minu = { name: 'Minwoo', }; const yewon = { name: 'Yewon', }; function ShowName() { console.log(this.name); } ShowName(); // 아무것도 출력되지 않음 ShowName.call(minu); // Minwoo라는 값이 출력. ShowName() 을 호출하면 아무 일도 일어나지 않..