자바스크립트 너트쉘

Dec 14 2022

이 문서는 JavaScript 초보자를 대상으로 하며 언어 학습에 대한 일반적인 지식과 유용한 팁을 포함합니다. JavaScript를 직접 배우면서 읽은 다양한 기사와 댓글에서 이러한 통찰력을 수집했습니다.

이 문서는 JavaScript 초보자를 대상으로 하며 언어 학습에 대한 일반적인 지식과 유용한 팁을 포함합니다. JavaScript를 직접 배우면서 읽은 다양한 기사와 댓글에서 이러한 통찰력을 수집했습니다. 이 정보가 자신의 JavaScript 여정에 도움이 되기를 바랍니다.

자바스크립트란 무엇입니까?

JavaScript는 클라이언트 측 및 서버 측 개발 모두에 사용되는 가장 인기 있는 웹 스크립팅 언어입니다. 객체 지향 프로그래밍 기능을 지원하는 JavaScript 코드는 웹 브라우저에서 이해하고 실행할 수 있는 HTML 페이지에 삽입할 수 있습니다.

ECMA스크립트란?

ECMAScript(European Computer Manufacturesr Association Script)는 Javascript를 기반으로 하는 스크립팅 언어입니다. ECMAScript는 ECMA International에서 표준화한 프로그래밍 언어입니다. 주로 웹 브라우저에서 실행되는 클라이언트 측 스크립트를 생성하는 데 사용되지만 Node.js 및 Apache CouchDB와 같은 다른 환경에서도 사용됩니다. ECMAScript는 널리 사용되는 JavaScript 프로그래밍 언어의 표준화된 버전이며 두 용어는 종종 같은 의미로 사용됩니다. ECMAScript는 매년 새로운 기능을 언어에 추가하며 최신 버전은 ECMAScript 2021입니다.

"=="와 "===" 연산자의 차이점.

javascript에서 "=="와 "===" 연산자의 주요 차이점은 == 연산자는 비교 전에 피연산자의 유형 변환을 수행하는 반면 === 연산자는 피연산자의 값과 데이터 유형을 비교한다는 것입니다. 피연산자.

JavaScript에서 지원하는 데이터 유형은 무엇입니까?

한정되지 않은
없는
부울
물체
끈
상징
숫자

JavaScrpt의 클로저는 다른 함수 내부의 기능입니다. 내부 함수는 자체 변수, 외부 함수에 정의된 변수 및 전역 변수에 액세스할 수 있습니다.

let a = 5;
function outher(){
 let b = 8
    function inner(){
        let c = 3;
        console.log(a + b + c);
    }
    inner();
}
outher();

JavaScript에서 NaN은 Not-a-Number의 줄임말입니다. JavaScript에서 NaN은 유효한 숫자가 아닌 숫자입니다. Global NaN 속성은 Number와 동일합니다.

Javascript에서 개체를 어떻게 만들 수 있습니까?

let person = {
name : "Umut",
age : 27,
isHappy: true
}

const cars = ["Saab", "Volvo", "BMW"];
const cars = [];
cars[0]= "Saab";
cars[1]= "Volvo";
cars[2]= "BMW";
const cars = new Array("Saab", "Volvo", "BMW");

가볍고 해석된 프로그래밍 언어
크로스 플랫폼 호환
오픈 소스
객체 지향
다른 백엔드 및 프런트엔드 기술과의 통합
특히 네트워크 기반 애플리케이션 개발에 사용

JavaScript의 범위는 JavaScript에 대한 변수의 액세스 가능성을 결정하는 코드의 현재 컨텍스트를 나타냅니다.

글로벌 범위:
전역 범위를 갖는 전역 변수는 JavaScript 코드의 모든 위치에서 사용할 수 있습니다.
간단히 말해서 프로그램의 어디에서나 액세스할 수 있는 변수를 전역 범위를 가진 변수라고 합니다. 전역 범위 변수는 let, const 및 var의 세 가지 키워드 중 하나를 사용하여 정의할 수 있습니다.

지역 변수는 해당 변수가 정의된 함수 내에서만 접근 가능합니다. 함수 내부에 정의된 변수를 외부 또는 다른 함수에서 접근하려고 하면 오류가 발생합니다.

함수 외부에서 지역 변수에 접근할 수 없기 때문에 다른 함수에서도 같은 이름의 변수를 가질 수 있습니다.

2015년 ES6(ECMAScript 6)을 도입하기 전에 JavaScript에는 전역 범위와 지역 범위의 두 가지 유형의 범위만 있었습니다.
let 및 const 키워드의 도입으로 JavaScript에 새로운 유형의 Scope가 추가되었습니다. 블록 외부에서 특정 블록({}로 표시) 내부에 선언된 변수에 액세스할 수 없습니다.

각각의 새 기능을 생성하면 JavaScript에서 새 범위가 생성됩니다. 함수 외부 또는 다른 함수에서 함수 내부에 정의된 변수에 액세스할 수 없습니다. Var, let 및 const는 함수 내에서 사용될 때 유사하게 작동합니다.

let myFunction = (a, b) => a * b;
hello = () => {
  return "Hello World!";
}

JavaScript의 'this' 키워드는 현재 호출하는 객체를 나타냅니다. 객체 속성에 값을 할당하기 위해 생성자에서 일반적으로 사용됩니다.

// Regular Function:
hello = function() {
  document.getElementById("demo").innerHTML += this;
}
// The window object calls the function:
window.addEventListener("load", hello);
// A button object calls the function:
document.getElementById("btn").addEventListener("click", hello);

var와 let은 둘 다 자바스크립트에서 변수 선언에 사용되지만 차이점은 var는 함수 범위이고 let은 블록 범위라는 것입니다.

자바스크립트의 오류 유형

JavaScript 오류에는 7가지 유형이 있습니다.

구문 오류
참조 오류
유형 오류
평가 오류
범위 오류
URI 오류
내부 오류

DOM(Document Object Model)은 웹 문서용 프로그래밍 인터페이스입니다. 프로그램이 문서 구조, 스타일 및 콘텐츠를 변경할 수 있도록 페이지를 나타냅니다. DOM은 문서를 노드와 객체로 나타냅니다. 그렇게 하면 프로그래밍 언어가 페이지와 상호 작용할 수 있습니다.

바닐라 JS의 속성과 속성의 차이점

JavaScript(실제 DOM)에서 요소에는 속성과 속성이 있습니다. 이 용어는 종종 같은 의미로 사용되지만 실제로는 별개의 두 가지입니다.
속성은 DOM에서 렌더링될 때의 초기 상태입니다. 속성은 현재 상태입니다.
대부분의 경우 특성과 속성은 자동으로 동기화됩니다. 예를 들어 setAttribute()를 사용하여 ID 속성을 업데이트하면 id 속성도 업데이트됩니다.

let p = document.querySelector('p');

// Update the ID
p.setAttribute('id', 'first-paragraph');

// These both return "first-paragraph"
let id1 = p.getAttribute('id');
let id2 = p.id;

세 가지 호출, 바인딩 및 적용 메서드 모두 this 인수를 함수에 설정합니다.

call 및 apply 메서드는 이것을 함수로 설정하고 함수를 호출합니다.
bind 메서드는 이것을 함수로만 설정합니다. 함수를 별도로 호출해야 합니다.

call 메서드는 this 값을 함수에 바인딩하고 함수를 실행합니다. 이 값과 인수 목록을 매개변수로 사용합니다. 그런 다음 call 메서드를 사용하여 호출된 함수가 반환한 값을 반환합니다.

function test(arg1, arg2){
  console.log(this.num, arg1, arg2); // 100, 10, 20
}

test.call({num: 100}, 10, 20);

적용하다

apply 메서드는 this 값을 함수에 바인딩하고 함수를 실행합니다. this 값과 단일 배열 객체를 매개 변수로 사용하고 apply 메서드를 사용하여 호출되는 함수가 반환하는 값을 반환합니다.

function test(...arguments){
  console.log(this.num, arguments);//100, [1,2,3]
}

test.apply({num: 100}, [1,2,3]);
// call() and apply() are identical in functionality,
// the only difference is that call() accepts a list of arguments;
// whereas, apply() accepts a single array of arguments.

bind 메서드는 this 값을 함수에 바인딩하고 새 함수를 반환합니다. 그러나 여전히 반환된 함수를 별도로 호출해야 합니다.