본문 바로가기

JavaScript10

[JS] 객체와 클래스 여러 개의 값을 그룹으로 묶어 객체를 생성할 수 있다.const user = { name: "Max", age: 34, greet() { console.log("Hello"); console.log(this.name); }};console.log(user);console.log(user.name);user.greet();name과 age 프로퍼티에 값을 넣는다.점을 통해 객체의 값에 접근한다.function 키워드 없이 함수를 넣을 수 있다.객체 내 함수를 메소드라도 부른다.메소드에 매개변수를 받거나, return으로 반환하거나, console.log를 작성할 수 있다.메소드는 this 키워드로 객체의 프로퍼티에 접근할 수 있다. class로 실제 객체를 생성 시 사용할 청사진을.. 2024. 7. 5.
[JS] 화살표 함수 화살표 함수란함수 표현식보다 단순하고 간결한 문법으로 함수를 만들 수 있는 방법을 말한다.let func = function(arg1, arg2, ...argN) { return expression;}; 위와 같은 함수를아래와 같이 간략하게 표현할 수 있다.let func = (arg1, arg2, ...argN) => expression 화살표 함수를 아래와 같이 더 간략하게 사용할 수 있다.  1) 매개변수 () 괄호 생략하기화살표 함수가 정확히 하나의 매개변수만 사용하는 경우, 묶는 괄호를 생략할 수 있다.let func = (userName) => { ... } userName이라는 하나의 매개변수만 사용되니 매개변수를 묶는 () 괄호 없앨 수 있다.let func = userName => { .. 2024. 7. 4.
[JS] import 와 export 사용하는 방법 import/export 문법은 여러 파일에 코드를 분리해 관리하기 위함이다.  export / import  {...} fromutill.jsexport let apiKey = "adfasdgkl";작성된 변수나 함수를 다른 파일에서 사용하려면 export를 추가해 준다.app.jsimport { apiKey } from "./utill.js"console.log(apiKey);다른 파일의 변수나 함수를 사용하려면 import { 변수나 함수명 } from “파일 경로”를 작성한다.리액트는 파일명에 확장자(. js)를 쓰지 않아도 된다. 빌드 프로세스가 알아서 확장자(.js)를 추가하기 때문이다. 빌드 프로세스가 없는 자바스크립트는 확장자를 입력해야 한다.변수나 함수명은 대소문자 구분해서 똑같이 입력한.. 2024. 6. 19.
[React] map() map()자바스크립트 배열의 내장 함수(메소드)이다.배열의 요소를 돌면서 인자로 전달된 함수를 사용해 처리된 새로운 결과를 새로운 배열에 담아 반환한다.let arr = [3, 4, 5, 6];let modArr = arr.map(function(element){ return element *3;});console.log(modArr); // [9, 12, 15, 18]  arr.map(function(element, index, array){  }, this);요소(element)뿐만 아니라 인덱스(index), 전체 배열 객체(array)를 전달하고, this는 콜백함수 내부에서 사용하게 된다.  리액트 map() 예시const ItemList = () => { const data = ['.. 2024. 6. 12.
반응형

티스토리툴바