Will's Log

안녕하세요, 윌입니다. 이번엔 비교 연산자에 대한 정리입니다. 자바스크립트에서 비교 연산자는 두 값의 관계를 비교하여 결과를 반환하는 연산자입니다. 비교 연산자는 주로 조건문이나 반복문에서 많이 사용됩니다. 자바스크립트에는 여러 가지 비교 연산자가 있으며, 각각의 의미와 용법은 다음과 같습니다:  1. 동등 연산자 (==)두 값이 같은지 비교하며, 필요에 따라 형 변환을 수행합니다. console.log(5 == '5'); // true (숫자와 문자열을 비교하며 형 변환이 발생)console.log(0 == false); // true (숫자 0과 불리언 값을 비교하며 형 변환이 발생)  2. 일치 연산자 (===)두 값이 같은지 비교하며, 형 변환을 수행하지 않습니다. 값과 자료형이 모두 같아야 합니..

안녕하세요, 윌입니다. undefined, null, NaN에 대해 정리해봅니다. 자바스크립트에서 undefined, null, NaN는 각각 고유한 의미와 용도를 가진 특수한 값입니다. 이 값들은 각각의 상황에서 다르게 동작하며, 그 차이점을 이해하는 것이 중요합니다. 1. undefinedundefined는 선언되었지만 값이 할당되지 않은 변수에 자동으로 할당되는 값입니다. 또한, 함수가 명시적으로 값을 반환하지 않을 때도 undefined가 반환됩니다. 특징선언은 되었지만 초기화되지 않은 변수의 기본 값:let a;console.log(a); // undefined객체의 존재하지 않는 프로퍼티에 접근할 때:let obj = {};console.log(obj.property); // undefined..

안녕하세요, 윌입니다. 이번엔 템플릿 리터럴에 대한 정리를 해보려고 합니다. 템플릿 리터럴(Template Literal)은 ES6(ECMAScript 2015)에서 도입된 문자열 리터럴의 한 형태로, 백틱(backtick)(```)으로 감싸여 있으며, 보간(interpolation)과 여러 줄 문자열을 지원하는 것이 특징입니다. 템플릿 리터럴을 사용하면 가독성이 높고 유연한 문자열 처리가 가능합니다. *참고 리터럴이란? https://jsdnl123.tistory.com/31#google_vignette 리터럴(Literal)과 변수(Variable)의 차이는 무엇인가?안녕하세요, 윌입니다. 개발 강의를 듣거나 관련 서적을 접하다보면 꼭 "리터럴"이라는 단어를 볼 수 있습니다. 이 단어는 꼭 "변수"와..

안녕하세요, 윌입니다. 개발 강의를 듣거나 관련 서적을 접하다보면 꼭 "리터럴"이라는 단어를 볼 수 있습니다. 이 단어는 꼭 "변수"와 비교하여 사용이 되는데요,  리터럴과 변수는 모두 프로그래밍에서 값을 다루는 중요한 요소이지만, 둘 사이에는 분명한 차이가 있습니다. 아래에서 리터럴과 변수의 정의, 역할, 차이점을 설명하겠습니다.  리터럴(Literal) 정의: 리터럴은 소스 코드에서 직접 값을 나타내는 표현식입니다. 리터럴 자체가 값을 의미하며, 프로그램 실행 시 그 값이 변하지 않습니다.42 // 숫자 리터럴"Hello" // 문자열 리터럴true // 불리언 리터럴[1, 2, 3] // 배열 리터럴{ name: "Alice", age: 30 } // 객체 리터럴 변수 (V..

안녕하세요, Will 입니다. 오늘은 JSX가 무엇인지, 어떻게 사용하는지에 대해 작성해 보도록 하겠습니다. JSX란? JSX는 Javascript의 확장 문법으로 Javascript XML의 줄임말이에요. React 팀에서 직접 고안한 문법이구요, React 개발을 위해 Javascript와 HTML을 섞어서 사용하는 문법입니다. JSX는 사용자 인터페이스 개발을 쉽고, 편하게 가능하게 해줍니다. 쉽게 얘기해서 사용자 지정 HTML이라고도 할 수 있겠습니다. 코드를 보시면 좀 더 이해가 쉬우실 거에요. 아래 코드는 CRA로 처음 프로젝트를 생성했을 때 코드입니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 import logo ..

*아직 작성 중입니다. '문(statement)'에 대한 내용 추가 예정 자바스크립트를 배우며 맞이하게되는 용어는 자바스크립트만의 것이 아니라 컴퓨터 공학 대부분에서 사용되는 용어다. 용어에 대한 개념 이해는 개발자 간 커뮤니케이션 뿐만 아니라 문서 및 매뉴얼 작성에도 상당한 도움이 된다. 요즘 공부를 하며 용어에 대한 이해가 부족한 듯 싶어 정리하고자 한다. 개념을 이해한다는 것은 용어를 정확히 이해하고 설명할 수 있다는 것이다. 1. 값 값(value)은 식(표현식, expression)이 평가(evaluate)되어 생성된 결과를 말한다. 평가란 식을 해석해서 값을 생성하거나 참조하는 것이다. 아래 예제의 식은 평가되어 수자 값 30을 생성한다. 10+20; // 30 변수는 하나의 값을 저장하기 위..

안녕하세요, Will 입니다. 오늘은 배열(Array)의 forEach를 설명하도록 하겠습니다. 1. forEach 사용법 아래 코드를 보자 1 2 3 4 5 6 var arr = [1,2,3,4,2]; arr.forEach(function(element, index, all){ console.log(`${element}: ${index} :${all}`); console.log(this.ten); },{ten:10}); Colored by Color Scripter cs forEach문은 위와 같이 function을 Parameter로 가지며, 콜백 함수라고 한다. 콜백 함수는 배열의 element 하나 씩 읽어가며 호출된다. 즉 element 수(Length) 만큼 호출된다. 콜백 함수의 Parame..

일급 객체 다음과 같은 조건을 만족하는 객체를 일급 객체라 한다. 1. 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다. 2. 변수나 자료구조(객체, 배열 등)에 저장할 수 있다. 3. 함수의 매개변수에 전달할 수 있다. 4. 함수의 반환값으로 사용할 수 있다. 함수가 일급 객체라는 것은 함수를 객체와 동일하게 사용할 수 있다는 의미. - 즉 함수는 값을 사용할 수 있는 곳(변수 할당문, 객체의 프로퍼티 값, 배열의 요소, 함수 호출의 인수, 함수 반환문) 이라면 어디든지 리터럴로 정의할 수 있음. 런타임에 함수 객체로 평가됨. - 일급 객체로서 함수의 가장 큰 특징은 일반 객체와 같이 함수의 매개변수로 전달 가능하며, 함수의 반환 값으로 사용 가능하는 점임. 이는 함수형 프로그래밍을 가..

continue 문은 반복문의 코드 블록 실행을 현 지점에서 중단하고 반복문의 증감식으로 실행 흐름을 이동시킨다. break 문처럼 반복문을 탈출하지는 않는다. 아래는 string 값을 for문으로 돌며 search 값이 몇 개 있는지 확인해보는 코드이다. 'Hello World' 내 'l'이 3개 있으므로 count는 3이 된다. const string = 'Hello World.' const search = 'l' let count = 0 // 문자열은 유사 배열이므로 for문으로 순회할 수 있다. for(let i=0; i

오늘은 JavaScript Break 문에 대해 작성해보겠다. 앞서 포스팅한 반복문 페이지에서 switch 문과 while 문에서 살펴보았듯이 break 문은 코드 블록을 탈출한다. 좀 더 정확히 표현하자면 코드 블록을 탈출하는 것이 아니라 레이블 문, 반복문(for, for...in, for...of, while, do...while) 또는 switch 문의 코드 블록을 탈출한다. 그 외 break 문 사용 시 SyntaxError(문법 에러)가 발생한다. 아래와 같이 if문에 break를 사용하면 Syntax에러가 발생한다. if(true){ break; // Uncaught SyntaxError: Illegal break statement } 참고로 레이블 문이란 식별자가 붙은 문을 말한다. // ..