본문 바로가기

반응형

JavaScript/JS 초급&개념

require와 fetch의 차이점 정리 require와 fetch의 차이점 정리자바스크립트에서 require와 fetch는 전혀 다른 역할을 하는 기능입니다. 이 글에서는 두 함수의 목적, 사용 환경, 동작 방식 등의 차이를 정리합니다.✅ require (CommonJS 모듈 시스템)용도: 자바스크립트 코드에서 다른 파일이나 모듈을 불러올 때 사용사용 환경: Node.js동작 방식: 동기적(synchronous)예시:const fs = require('fs');특징:로컬 파일 또는 Node 내장 모듈을 불러옴파일 내용을 읽는 게 아니라, 모듈 전체를 가져와 실행✅ fetch (웹 API)용도: HTTP 요청을 보내서 외부 리소스를 가져올 때 사용사용 환경: 브라우저, 최신 Node.js 환경동작 방식: 비동기적(asynchronous) (Pr.. 더보기
[JS] if, else를 표현하는 세 가지 방법: 삼항연산자, 논리 연산자 && || 자바스크립트에서 조건문을 표현하는 세 가지 방법 1) if, else 문을 사용하는 방법 let tempStr = ''; // 1. if, else 사용 if (tempStr === '') console.log('tempStr은 빈 객체입니다.'); else console.log('tempStr은 빈 객체가 아닙니다.'); 2) 삼항 연산자 사용하는 방법 아래와 같이 사용할 수 있다. (조건) ? (조건이 true일 경우) : (조건이 false일 경우) let tempStr = ''; // 2. 삼항연산자 사용 tempStr === '' ? console.log('tempStr은 빈 객체입니다.') : console.log('tempStr은 빈 객체가 아닙니다.'); 3) 논리 연산자 &&, || 사용.. 더보기
[JS] 자바스크립트 ==와 === 비교연산자, null과 undefined (아래 글을 참고하여 작성한 글임을 밝힙니다.) [Javascript] '=='와 '==='의 차이 (null, undefined) 지난번에는 '==' 연산자와 '===' 연산자의 기본적인 차이점에 대해서 알아보았습니다. [Javascript] '==' 연산자와 '===' 연산자의 차이점 이번에는 '=='와 '===' 연산자를 이용해서 null, undefined 값을 체크 hianna.tistory.com == 연산자 사용 시 null과 undefined를 == 연산자를 사용해서 비교할 경우, null과 비교하든, undefined와 비교하든 모두 true를 반환합니다. null과 undefined를 === 연산자를 사용해서 비교할 경우, 값이 정확하게 일치하는 경우에만 true를 반환합니다. 더보기
[JS] 7장. 자바스크립트 상속 패턴 (1) 기본 패턴 기본 패턴: 생성자의 정의를 안해서 문제 kid.say를 하면 Adam이 나옴 (2) 생성자 빌려쓰기 생성자 빌려쓰기: 프로토타입 연결이 안됨 function Child(name) { Parent.apply(this, arguments) } class Child extends Parent { constructor() { super(); } } // 와 유사 // kid.say를 못함 (3) 생성자 빌려쓰고 프로토타입 지정 생성자 빌려쓰고 프로토타입 지정: 괜찮지만 Parent 너무 많이 호출 function Child(name) { Parent.apply(this.arguments); } Child.prototype = new Parent(); 부모가 계속 new가 됨 (4) 프로토타입.. 더보기
[JS] 6장-2. 함수 호출 2-5) 함수 호출 function func(arg1, arg2) { // debugger // 넣으면 중단점 console.log(arg1, arg2); } func(); //undefined undefined func(1); //1 undefined func(1, 2); //1 2 func(1, 2, 3); //1 2 매개변수 개수가 맞지 않아도 오류가 나지 않음 함수 호출이 자유로움(오버로딩이 필요 없음) 매개변수는 유사배열이라 push 등 배열 메소드는 없지만 배열처럼 작업하고 싶은 경우 Array.prototype.slice.apply(arguments).push // 이렇게 작업 가능하다 (1) this 바인딩 var obj = { name: 'max', // 객체 obj에 속함 say: fu.. 더보기
[JS] 6장-1. 함수와 프로토타입 1) 함수 정의 - 함수 선언문 - 함수 표현식 - Function() 생성자 함수 1-1) 함수 선언문 함수 선언문: 함수 리터럴 형태로 함수 정의 function add(x, y) { return x + y; } 1-2) 함수 표현식 함수 표현식: 함수를 하나의 값으로 특정 변수에 할당 var add = function (x, y) { return x + y; } var plus = add; add(1, 2) // 3 plus(2, 3) // 5 var add = function plus(x, y) { return x + y; } add(1, 2); plus(2, 3); // 에러 발생, 함수 표현식으로 함수를 정의하면 함수 선언문에서의 함수명은 add로 변경 var factorialVar = fun.. 더보기
[JS] 5장. 자바스크립트의 메모리 관리 자바스크립트의 메모리 관리 var string = new String("aa") string == string1; // true string1 = 'aa'; // 'aa' string === string1; // false string.toString() === string1 // true // 생각해볼것: 기본형도 참조형을 toString()같은 메소드로 바꿔 보여주는 것 아닐까? [번역] 자바스크립트의 메모리 관리 설명 JavaScript에서 변수, 함수, 객체 등이 어디에서 어떻게 저장되고 사용되는지, 그리고 더 이상 필요하지 않을 때 어떻게 수집되는지를 간략히 설명한 글입니다. velog.io 더보기
[JS] 4장. 배열 4-1. 배열 JS는 인터프리터 언어, 컴파일 안해도 됨, 자유로움 다만, 이게 문제가 되는 경우도 있어 타입스크립트가 나옴 var arr = [1, "a", function() {}, {}]; // 이래도 됨 console.log(arr[1]); // 'a' var arr1 = []; arr1.push(1); arr1[4] = 10; console.log(arr1.length); // 5 arr1 // (5) [1, empty x 3, 10] var arr3 = new Array(3); // new는 엔진을 좀 소모, 리터럴을 사용하자 arr3; // (3) [empty x 3] var arr4 = new Array(4, 5); arr4; // (2) [3, 4] var arr5 = new Array(.. 더보기

반응형