1. 자바스크립트 시작console.log()확인하고 싶은 메세지나 데이터를 콘솔에 기록하기 위해 사용한다.주석// 를 사용하거나 /* */ 사이에 적는다.2. 변수 선언var중복 할당과 재할당이 가능하다.let중복 선언이 불가하고 재할당이 가능하다.const상수 선언 시 사용하고 재할당은 불가하다. typeof값의 데이터 유형(문자열)을 반환한다.` ${} `템플릿 리터럴은 백틱 안에서 사용 가능하다. 3. 조건문if주어진 조건이 true라고 평가되면 작업을 실행한다.else ifif가 아닌 다른 조건이 true라고 평가되면 작업을 실행한다.else주어진 조건이 false일 경우 작업을 실행한다.let hungerLevel = 7;if(hungerLevel>7){ console.log('Time to..

24-25/Node.js 1 2024. 10. 4. 10:00

1. 함수함수를 알아보기 전, 우리가 함수를 사용하는 이유는 무엇일까? 자바스크립트 코드를 작성하다 보면 유사하게 동작하는 코드를 작성할 때가 있다. 이때, 유사한 코드를 중복해 작성하면, 코드는 길어지고 가독성도 현저히 떨어진다. 그래서 우리는 유사코드를 하나로 묶은 함수를 사용한다. 이름이 붙은 명령들의 모음인 '함수'를 사용하며 더 간결하고 구조적인 프로그래밍이 가능하게 된다. 이제 함수의 사용법을 본격적으로 알아보겠다.  1-(1) 함수 선언함수를 사용하기 위해서는 함수를 정의하는 작업인 함수 선언을 해야 한다. 함수 선언은 호출하면 바로 실행할 수 있도록 준비하는 작업이라고 생각할 수 있다. 자바스크립트에서는 function이라는 키워드를 사용해 함수를 만든다. function 키워드 바로 다음..

24-25/React.js 1 2024. 9. 27. 10:00

1. 함수 유사하게 동작하는 코드를 중복하여 작성하면, 코드가 길어지고 가독성도 떨어진다.이때, 함수를 사용하면 유사하게 동작하는 중복코드를 하나의 블록 단위로 묶어 간결하게 프로그래밍 할 수 있다. 또한 필요할 때마다 호출하여 사용할 수 있으므로 구조적인 활용이 가능하다. [ 함수 선언 ]function 함수 이름 (매개변수) {  함수가 수행하는 명령} 자바스크립트에서는 'function'이라는 키워드를 사용해 함수를 선언한다. function 다음에는 함수의 이름, 그 다음으로 매개변수가 오며, 중괄호로 감싼 곳에 함수가 수행할 명령을 작성한다. 매개변수는 함수에 값을 전달하는 매개체를 의미한다.[ 함수 호출 ] 함수 선언 이후, 함수를 실행하기 위해서는 함수를 호출해야 한다. function gr..

24-25/React.js 2 2024. 9. 27. 10:00

리액트 기술 블로그에 오신 여러분, 환영합니다! 저희 블로그에서는 리액트(React)에 대한 다양한 기술적인 내용을 다룰 예정입니다. 리액트는 현대적인 웹 개발에서 매우 중요한 역할을 하는 라이브러리로, 빠르고 효율적인 웹 애플리케이션을 구축하기 위한 필수 도구 중 하나입니다. 리액트는 자바스크립트 라이브러리이기 때문에 자바스크립트에 익숙하지 않다면 학습하기 어렵습니다. 기초적인 자바스크립트를 공부했다는 전제 하에 기본적인 자바스크립트 문법을 다시 한번 살펴보고, 이어서 객체의 특징이나 단락평가 같은 실전에 적용할 수 있는 문법을 다루겠습니다. 1. 함수 함수의 사용법을 본격적으로 알아보기 전에, 우리가 함수를 사용하는 이유가 무엇일까요? 자바스크립트 코드를 작성하다 보면 유사하게 동작하는 코드를 작성할..

23-24/React.js 1 2023. 9. 29. 10:00

1. 함수(Function) 'function' 키워드를 사용해 함수 선언한다. fuction 함수 이름 (매개변수) { 함수가 수행하는 명령 } 인수: 함수를 호출하면서 넘겨주는 값이다. 매개변수: 넘겨받은 인수를 저장할 변수이다. fuction 함수 이름 (매개변수) { 함수가 수행하는 명령 } 함수 이름(); //함수 호출문 return문으로 수행한 결과 반환한다. 함수 내에서 return문을 만나면 함수는 종료한다. function getArea(width, height) { let area = width * height; return area; // 수행한 결과 반환 } let result = getArea(10, 20); console.lo..

23-24/React.js 2 2023. 9. 29. 10:00

Javascript란? 자바스크립트에 대해 자세히 살펴보기 전에 우리가 보는 인터넷 웹 페이지 구성에 대해 먼저 살펴보자. 웹 페이지는 HTML, CSS, Javascript 이 3가지의 언어로 만들어진다. HTML은 웹 페이지 요소의 배치를, CSS는 스타일링을, Javascript는 동작을 담당한다. 웹페이지의 주된 목적은 정보 전달 뿐만이 아닌 사용자와의 상호작용이다. 자바스크립트를 사용하여 동적인 기능을 장착할 수 있게 되고 자바스크립트 엔진은 그것을 가능하게 한다. 이것이 오늘날 자바스크립트의 중요성이 점점 커지고 있는 이유이기도 하다. 이제 자바스크립트 문법을 본격적으로 살펴보도록 하자. 변수와 상수 변수는 값을 가리키는 이름이면서 값의 저장소이다. 값 변경이 가능하고 선언과 동시에 할당(초기..

23-24/React.js 3 2023. 9. 29. 10:00

코드를 작성하다보면 다음과 같이 반복되는 코드를 작성할 수도 있습니다. import React from ‘react‘; const IterationSample = () => { return ( 떡볶이 마라탕 치킨 초밥 ); }; export default IterationSample; 위의 예시는 li 태그의 반복입니다. 위의 예시는 간단하기에 그냥 li 태그를 반복해서 작성해도 큰 문제가 없지만, 간단한 반복에서 나아가 반복되는 코드들이 많아진다면 코드의 양은 늘어나고 파일의 용량도 증가해 쓸데없는 낭비가 발생할 것 입니다. 이번 6장에서는 반복적인 내용을 효율적으로 보여주고 관리하는 방법에 대해서 설명하도록 하겠습니다. 6.1 자바스크립트 배열의 map() 함수 자바스크립트에서는 배열 객체의 내장 함..

22-23/22-23 리액트 스타터 3 2022. 11. 10. 10:00

이번 장에서는 리액트 프로젝트에서 반복적인 내용을 효율적으로 보여 주고 관리하는 방법을 알아봅시다. 6-1 자바스크립트 배열의 map() 함수 자바스크립트 배열 객체의 내장 함수인 map 함수를 사용하여 반복되는 컴포넌트를 렌더링 할 수 있습니다. map 함수는 파라미터로 전달된 함수를 사용하여 배열 내 각 요소를 원하는 규칙에 따라 변환한 후 그 결과로 새로운 배열을 생성합니다. arr.map(callback, [thisArg]) callback은 새로운 배열의 요소를 생성하는 함수입니다. 파라미터는 아래 세 가지입니다. currentValue: 현재 처리하고 있는 요소 index: 현재 처리하고 있는 요소의 index 값 array: 현재 처리하고 있는 원본 배열 thisArg(선택 항목): call..

21-22/21-22 리액트 스타터 -1 2021. 11. 29. 13:00

5. Arrays ● Arrays 1. 배열 목록을 만들어서 데이터를 저장하는 것을 말한다. let newYearsResolutions = ['Keep a journal', 'Take a falconry class', 'Learn to juggle']; 2. Create an Array 배열 만들기 배열을 변수에 저장이 가능하다. let newYearsResolutions = ['Keep a journal', 'Take a falconry class', 'Learn to juggle']; Instruction 1. 변수에 3개의 문자열을 넣는다. 2.console.log()를 사용해서 출력한다. const hobbies=["dance", "sing", "study"]; console.log(hobbies..

21-22/21-22 리액트 스타터 -2 2021. 10. 8. 21:02