본문 바로가기

언어

 (9)
[JavaScript] undefined 와 null의 차이점 JavaScript에서 undefined 와 null 은 모두 "없다" 라는 것을 의미하지만 둘은 다른 값 입니다 undefined 와 null의 차이점에 대해서 알아보자undefinedvar 키워드로 선언한 변수는 암묵적으로 undefined로 초기화됩니다. 다시 말해, 변수 선언에 의해 확보된 메모리 공간을 처음 할당이 이뤄질 때까지 빈 상태(대부분 비어 있지 않고 쓰레기 값이 들어 있다)로 내버려두지 않고 자바스크립트 엔진이 undefined로 초기화 합니다. 따라서 변수를 선언한 이후 값을 할당하지 않은 변수를 참조하면 undefined가 반환됩니다. var foo;console.log(foo); // undefined 이처럼 undefined는 개발자가 의도적으로 할당하기 위한 값이 아니라 자바..
[JavaScript] Async & Await이란 Async Async는 비동기 함수를 정의할 때 사용하는 키워드함수를 만들 때 사용하는 function 키워드 앞에다가 붙여주기. -> 비동기 함수가 됨. 그렇다면 이 함수와 일반 함수는 어떤 차이가 있을까? async function getUser() { return "kangNew";}const user = getUser();console.log(user); Async를 붙여주면 이 함수는 항상 프로미스를 리턴하는 '비동기 함수'가 됩니다. 함수 안에서 어떤 값을 리턴해주면 그 값은 프로미스로 감싸져서 반환됨. 그렇기에 getUser로부터 반환된 user는 프로미스가 됨. 출력해보면 프로미스 출력. 이제 'kangNew'라는 문자열에 접근하기 위해서는 프로미스에 'then'을 사용하면 됨. use..
[JavaScript] Promise 란 Promise란?비동기 처리에 사용되는 자바스크립트 객체, 비동기 작업이 맞이할 성공 혹은 실패를 나타냄 프로미스는 하나의 상자라고 볼 수 있음. 프로미스라는 상자는 비동기 작업이 시작될 때 만들어짐. 처음엔 상자가 텅 비어있다가 언젠가 결과물로 채워지게 됨. (비동기 작업이 완료될 때)    비동기 작업은 완료되기까지 시간이 좀 걸린다는 특징. 비동기 작업이 진행 중일 때는 프로미스 상자가 텅 비어있다. 그러다가 비동기 작업이 끝나면, 그 결과물로 프로미스 상자가 채워지게 됨. 이처럼 프로미스는 비동기 작업의 상태를 나타냄 진행 중인 비동기 작업은 언젠가 끝나게 됨. 작업이 성공할 수도 있고, 실패할 수도 있음. 예를 들어 서버로부터 데이터를 받아오는 비동기 작업이라고 가정했을 때, 데이터를 성공적으로..
[JavaScript] Callback functions 콜백함수란? 콜백함수(Callback Function) 란?콜백함수(Callback Function)는 함수의 인자로 전달되어, 해당 함수 내부에서 호출되는 함수를 말합니다. 콜백 함수는 다른 함수의 실행이 끝난 후 실행되도록 설계되어, 프로그램의 흐름을 유연하게 제어할 수 있습니다.콜백 함수의 기본 사용법아래는 콜백 함수의 간단한 예제입니다:function main(x) { x();}function sayHi() { console.log("Hello");}main(sayHi);이처럼 main 함수는 sayHi라는 함수를 파라미터로 전달받아 내부에서 실행합니다. 이 과정에서 sayHi 함수는 콜백 함수로 동작합니다. 다양한 콜백 함수 활용콜백 함수는 특정 기능을 다른 함수에서 재사용하거나, 원하는 시점에 실행할 ..
[JavaScript] 일반 함수 vs 화살표 함수(arg, this) 자바스크립트(ES6)에서 함수를 정의하는 방법은 크게 두가지로 나뉩니다.일반함수와 화살표 함수 function main() { console.log('hello'); } const main = () => { console.log('hello'); }; 1. 가변인자(arguments) function main() { console.log(arguments) // arg[0] -> 1 , arg[1] -> 2, arg[2] -> 3 } main(1,2,3)main()함수에 매개변수를 따로 정의해 주지 않아도 함수 내에서 arguments라는 변수를 전달 받습니다.즉, argumant 변수는 main()함수가 전달받은 인자를 담고있는 배열 형태의 객체 const main = (..
[JavaScript] This 와 Bind JavaScript에서 this 키워드는 많은 개발자들이 헷갈려하는 개념 중 하나입니다. 이 글에서는 this의 의미와 동작 방식, 그리고 실제 사용 예를 통해 이해를 돕고자 합니다. 1. this의 기본 개념this는 한마디로 함수를 호출한 객체를 가리킵니다. 이 간단한 정의가 처음에는 이해하기 어려울 수 있지만, 예제를 통해 살펴보면 이해가 될것입니다! 2. 전역 스코프에서의 thisconsole.log(this) // window 객체가 출력전역 스코프에서 this는 기본적으로 window 객체를 가리킵니다. 3. 객체 메서드에서의 thisconst object = { name : 'kangNew', main : function () { console.log(this.name); // ka..
[JavaScript] var, let, const 의 차이(호이스팅) JavaScript에서는 변수를 선언할 때 var, let, const를 사용할 수 있습니다. 그러나 var는 여러 문제점을 가지고 있어 사용을 지양하고, 대신 let과 const를 사용하는 것이 권장됩니다. 그 이유를 아래와 같이 정리했습니다. 1. var와 let의 차이점var와 let의 주요 차이점은 스코프(Scope), 중복 선언 가능 여부(Variable Redeclaration), 그리고 호이스팅(Hoisting)입니다. (1) 스코프(Scope)스코프란 코드가 변수에 접근할 수 있는 범위를 뜻합니다. JavaScript에서 스코프는 크게 세 가지로 나뉩니다:함수 스코프: var는 함수 스코프를 가집니다.블록 스코프: let과 const는 블록 스코프를 가집니다.전역 스코프: 전역 범위에서 선..
JavaScript 자주쓰는 배열관련 메소드 정리 sort() const arr1 = [1, 4, 5, 7, 9, 3]; const result = arr1.sort(function (comp1, comp2) { return comp1 - comp2; }); console.log(result); // [1, 3, 4, 5, 7, 9] //or const result = arr1.sort((comp1, comp2) =>{ return comp1 - comp2; }); arr1.sort() 를 사용하게 되면은 문자형 오름차순으로 정렬됩니다(내가 원하는 정렬값이 아님). 따라서 함수 comp1 과 comp2를 비교하여 return 해주는 함수를 추가해주어야 합니다. (꼭 return 해주셔야합니다 안하면 원하는 값의 배열을 얻을수없습니다) 배열내부에 객체형식..

티스토리툴바