본문 바로가기
반응형

Programming31

[JS] 형 변환(Type conversion) 이란? 형 변환이란?데이터의 유형을 다른 데이터 유형으로 변환하는 것을 의미하며, 크게 "묵시적 형 변환", "명시적 형 변환"으로나눌 수 있다. 1. 묵시적 형 변환자바스크립트는 두 값을 연산을 수행할 때 종종 자동으로 형 변환을 한다. * 문자열과 숫자 더하기 let a = 5; // numlet b = "10"; // stringconsole.log(a+b); // 결과값 : 510> 문자열과 숫자를 더할 경우 a 변수의 형을 num에서 string으로 자동 변환되어 문자열 + 문자열이 된다.* 문자열과 숫자 곱하기let a = 5; // numlet b = "10"; // stringconsole.log(a*b); // 결과값 : 50> 곱할 때는 문자열 b이 st.. 2024. 9. 20.
[JS] 스코프란 무엇인가?(블록 스코프, 전역 스코프, 함수 스코프) 스코프(Scope)란? 변수가 어느 위치에서 접근 가능한 지를 결정하는 규칙을 말한다.(변수의 유효 범위)자바스크립트에는 크게 전역 스코프, 함수 스코프, 블록 스코프 세 가지 주요 스코프가 있다. 전역 스코프(Global Scope)전역 변수는 함수나 블록 밖에서 선언되며, 자바스크립트 코드 어디서든 접근 가능하다. 전역 변수는 프로그램 전체에 걸쳐 사용되므로 매우 신중하게 사용해야 한다.* 예시// 전역변수 설정let globalVariable = "global";function test(){ // 함수 내에서도 접근 가능 console.log(globalVariable); // 결과값 : global}// 함수 호출test(); // 전역.. 2024. 9. 18.
[JS] var, const, let 변수의 종류와 차이점을 알아보자 자바스크립트에서 변수를 선언하는 방법으로는 주로 var, let, const 세가지 키워드를 사용한다.그렇다면, 이 세가지 키워드에는 어떠한 특징이 있으며, 차이점을 무엇일까? var 변수var는 ES6 이전에 변수를 선언할 때 사용하던 방식으로 특징들은 다음과 같다.* 특징- 함수 스코프(Function Scope): var 변수는 함수 내에서만 유효하며, 함수 외부에서는 사용할 수 없다. 블록( { } ) 내에서 선언을 해도 블록 스코프가 적용되지 않는다. (스코프란? : 2024.09.18 - [Programming/Javascript] - [JS] 스코프란 무엇인가?(블록 스코프, 전역 스코프, 함수 스코프) )- 중복 선언 가능: 같은 이름의 변수를 다시 선언해도 에러가 발생하지 않고, 값이 덮.. 2024. 9. 18.
[React] npm이란?(npx와 간단 비교) npm(Node Package Manager)이란 ? node.js 기술을 이용해서 만들어진 여러 앱들을 명령어 환경에서 손쉽게 설치할 수 있도록 도와주는 것이 npm이다.(node.js 계의 google play)npx(Node Package eXecute)란?npm의 5.2.0버전부터 추가된 도구로 간편하게 npm 패키지를 일회성으로 사용/실행하는 실행도구이다. 즉, 임시로 패키지를 설치하여 사용 후 제거된다고 생각하면 된다. npm과 npx를 비교?굳이 둘을 비교하자면npm은 전역으로 패키지를 설치하여 의존성 라이브러리들을 전체적으로 관리 또는 특정 프로젝트에만 의존성 라이브러리를 설치하여 사용한다.그러다 보니 업데이트가 있을 때 각 각 업데이트 관리를 해줘야 되는 번거로움이 있을 수 있다. npx.. 2024. 9. 12.
[생활코딩] React 06. state state란? 컴포넌트 함수를 다시 실행해서 새로운 return 값을 만드는 것을 state라 한다. * Prop과 State 차이점 - Prop은 컴포넌트를 사용하는 외부자를 위한 데이터 - State는 컴포넌트를 만드는 내부자를 위한 데이터 State의 값이 변경되면 새로운 리턴 값을 만들어서 UI가 업데이트되며, 새로운 리턴 값을 화면에 출력하게 된다. 즉, 동적인 페이지를 구성할 수 있는 것이다. 지금부터 만들 예제는 링크가 걸린 특정 단어를 클릭했을 때 화면 body에 특정 단어 안에 가지고 있는 문구들을 출력할 것이다. 코드 정리 화면 출력을 하는 app() 함수에서 작성을 해보겠다. 우선 태그를 클릭할 경우 body 영역에 Hello, WEB 이 생성되게 하고 태그를 클릭했을 시 body영역.. 2024. 1. 31.
[생활코딩] React 05. 이벤트 event html 에서는 이벤트를 발생시키는 onClick이 있다. React 컴포넌트에는 이러한 이벤트를 발생시킬 수 있는 방법이 뭐가 있을까? 우리는 컴포넌트 안에 이벤트를 설정하여 웹 화면에서 "WEB" 글자를 눌렀을 때 이벤트를 발생시켜보겠다. onChangeMode 위와 같이 props에 onChangeMode를 추가하여 해당 태그를 클릭할 때 alert 화면이 뜨도록 할 예정이다. 함수의 태그 안에 onClick 속성을 넣은 다음 리로드되는 것을 방지하는 event.preventDefault()를 호출 후 props에 onChangeMode()를 호출하도록 설정한다. 추가적으로 태그에 있는 html/css/js 내용도 클릭했을 시 각 각에 해당하는 id값이 뜨도록 설정해보자. 태그에 id값을 onCha.. 2024. 1. 23.
반응형

티스토리툴바