> 웹 프론트엔드 > JS 튜토리얼 > 중급자를 위한 Javascript에 관한 모든 것

중급자를 위한 Javascript에 관한 모든 것

Linda Hamilton
풀어 주다: 2024-11-29 07:41:13
원래의
195명이 탐색했습니다.

All About Javascript For Intermediate

자바스크립트란 무엇입니까:
자바스크립트는 오픈 소스 프로그래밍 언어입니다. 동적 웹 페이지를 만드는 데 도움이 됩니다. 브라우저 언어이기도 합니다.
클라이언트측(브라우저)과 서버측(Node.js와 같은 환경 사용) 모두에서 실행될 수 있습니다.
JavaScript는 여러 작업을 동시에 처리하는 데 필수적인 이벤트 중심, 비차단 및 비동기 프로그래밍을 지원합니다.

변수:
변수는 데이터를 저장하는 컨테이너입니다
변수 유형

  • 변수
  • 하자
  • 상수

연산자:
Javascript 연산자는 다양한 유형의 수학적, 논리적 계산을 수행하는 데 사용됩니다.
연산자 유형

  • 산술 = ,-,/,%,*
  • 비교
  • 논리적

데이터 유형
변수 유형 정의

원시 데이터 유형 = 값별로 값 저장

  • 문자열
  • 번호
  • 비긴트
  • 부울
  • 정의되지 않음 = 변수를 선언했지만 값이 정의되지 않았습니다. 데이터 유형이 정의되지 않았습니다
  • Null = 할당 값이므로 명시적으로 값을 null로 설정합니다. 데이터 유형은 객체입니다
  • 기호

비선미형 데이터 유형 = 참조(주소)로 값 저장

  • 객체 = 내장 객체 유형은 다음과 같습니다: 객체, 배열, 날짜, 지도, 세트, ​​인타레이, 부동 배열, 약속
  • 예:
  • null == undefine은 true이고, null === undefine은 false입니다.

JavaScript에서 내보내기와 기본 내보내기의 주요 차이점은 무엇인가요?
내보내기 기본값은 모듈에서 단일 값을 내보내는 데 사용된다는 것입니다.
명명된 내보내기를 사용하여 내보내기는 여러 값을 내보내는 데 사용됩니다

원시 데이터 유형과 비원시 데이터 유형의 주요 차이점은 ?

  • 기본 유형은 미리 정의되어 있고 비원시 유형은 프로그래머가 생성한다는 것입니다.
  • 단일 데이터 유형 값만 저장할 수 있고 여러 데이터 유형 값을 저장할 수 있는 기본 및 비기본 데이터 구조입니다. 원시 데이터 유형은 메모리에 직접 저장되는 반면, 비원시 데이터 유형은 해당 값에 대한 참조로 메모리에 저장됩니다.
  • 원시 데이터 유형은 값으로 전달되고 비원시 데이터 유형은 참조로 전달됩니다.
  • 기본 데이터 유형은 변경할 수 없습니다. 즉, 해당 값은 할당되면 변경할 수 없습니다. 기본이 아닌 데이터 유형은 변경 가능하며 수정될 수 있습니다.
  • 숫자, 문자열, 부울은 원시 데이터 유형의 예이고, 객체, 배열, 함수는 비원시 데이터 유형의 예입니다.

기능:
JavaScript 함수는 특정 작업을 수행하도록 설계된 코드 블록입니다.

자바스크립트는 정적 유형 언어인가요, 아니면 동적 유형 언어인가요?
JavaScript는 동적으로 유형이 지정되는 언어입니다. 동적 유형 언어에서는
변수 유형은 정적으로 유형이 지정된 언어와 달리 런타임 중에 확인됩니다.
컴파일 타임에 변수 유형을 확인하는 곳입니다.

값 전달과 참조 전달을 설명 ?
JavaScript에서는 기본 데이터 유형은 값으로 전달되고 기본이 아닌 데이터 유형은 참조로 전달됩니다.
기본 데이터 유형 = 문자열, 숫자, 부울, null, 정의되지 않음
비원시 데이터 유형 = 객체, 배열

자바스크립트에서 엄격 모드란 무엇이며, 자바스크립트 엄격 모드의 특징은 무엇인가요?
엄격한 운영 환경에서 코드나 함수를 작성할 수 있습니다.
결과적으로 디버깅이 훨씬 간단해집니다.

JavaScript의 팩토리 함수란 무엇인가요?
논리가 복잡하고 동일한 논리를 가진 여러 객체를 계속해서 생성해야 한다면
함수에 로직을 한 번 작성하고 해당 함수를 팩토리로 사용하여 객체를 생성할 수 있습니다.
실제 공장에서 제품을 생산하는 것과 똑같습니다.
팩토리 함수는 객체를 반환하는 함수입니다.

고차 함수:
fuction 다른 fuction을 인수로 받거나 함수를 반환합니다.
map, filter, Reduce 기능은 모두 HOF의 예입니다.
고차 함수는 이벤트 처리, 데이터 변환(예: 맵 및 필터), 함수 팩토리 또는 데코레이터 생성과 같은 작업에 유용합니다.

폐쇄:
함수가 다른 함수 내부에 정의되면 클로저가 생성됩니다.
내부 함수는 외부 함수 범위의 변수 및 메서드에 대한 액세스를 유지합니다
클로저는 함수 내에서 데이터를 캡슐화하는 수단을 제공하여 외부 범위에서 데이터를 숨기면서 해당 데이터에 대한 제어된 액세스를 허용합니다.

콜백:
다른 함수의 인수로 사용되는 함수를 콜백 함수라고 합니다.
콜백은 다른 함수가 실행된 후에 실행되는 함수입니다.
비동기 작업을 수행하려는 경우 콜백 함수의 사용 사례입니다.

map() 대 forEach()
지도()=> 배열의 각 요소를 반복하고 각 요소에 변환 함수를 적용합니다.
원래 배열을 수정하지 않습니다. 변환된 요소로 새 배열을 생성합니다.
forEach()=> 배열의 각 요소를 반복하고 각 요소에 대해 제공된 콜백 함수를 실행합니다.
새 배열을 생성하거나 기존 배열을 수정하지 않습니다. 콜백 함수만 실행합니다.

map() vs filter() vs Reduce()
map()은 새로운 배열을 반환합니다
filter()는 map()과 유사합니다. 또한 새 배열을 반환하지만 조건이 true인 경우. 조건을 적용하고 싶을 때 사용합니다.
Reduce()는 배열에서 단일 값을 반환합니다.

이 키워드:
this 키워드의 값은 항상 함수를 호출하는 객체에 따라 달라집니다.

커링:
n 인수의 함수를 n 함수로 변환합니다.
부분 적용을 활성화하는 사용 사례(여러 인수를 사용하는 함수가 있지만 그 중 일부만 수정하고 나머지는 나중에 사용하기 위해 열어두려는 경우),
코드 재사용.
예:

function add (a) {
  return function(b){
    return a + b;
  }
}
add(3)(4)
로그인 후 복사
로그인 후 복사

일반 vs 화살표 기능 ?
일반 기능:
이는 함수를 호출하는 객체를 참조합니다
생성자로 사용할 수 있습니다
함수 선언이 호이스팅됩니다(호스팅 허용)
화살표 기능:
자신의 것이 없습니다
생성자로 사용할 수 없습니다
함수 선언은 호이스팅되지 않습니다(호스팅 허용 안 함) // myfunc는 함수가 아닙니다

정상 및 삼항 조건 ?
삼항 조건은 이 컨텍스트 없이 참조를 저장합니다.

자바스크립트에서 exec() 메소드와 test() 메소드의 차이점은 무엇인가요?
test()와 exec()는 자바스크립트에서 사용하는 RegExp 표현식 메소드입니다.

외부 JavaScript를 사용하면 어떤 이점이 있나요?
코드를 재사용할 수 있습니다.
외부 자바스크립트(코드 모듈화)로 코드 가독성이 간편합니다

프로토타입:
JavaScript 프로토타입 속성을 사용하면 객체 생성자에 새 속성과 메서드를 추가할 수도 있습니다.
테스트 용도

메모:
메모화는 함수의 반환 값이 해당 매개변수에 따라 캐시되는 캐싱의 한 형태입니다.
해당 함수의 매개변수가 변경되지 않으면 캐시된 버전의 함수가 반환됩니다.

DOM:
DOM은 문서 개체 모델을 나타냅니다. DOM은 HTML용 프로그래밍 인터페이스입니다.
브라우저가 HTML 문서를 렌더링하려고 하면 DOM이 생성됩니다
이 DOM을 사용하여 HTML 문서 내부의 다양한 요소를 조작하거나 변경할 수 있습니다.

봄:
브라우저 개체 모델은 BOM으로 알려져 있습니다. 이를 통해 사용자는 브라우저와 상호 작용할 수 있습니다.
브라우저의 초기 개체는 창입니다.

약속:
약속은 자바스크립트에서 비동기 작업을 처리하는 데 사용됩니다. Promise 이전에는 콜백을 사용하여 비동기 작업을 처리했습니다.
Promise 객체에는 4가지 상태가 있습니다. -
보류 중 - 약속의 초기 상태입니다.
Fulfilled - 이 상태는 약속이 이행되었음을 나타냅니다.
거부됨 - 이 상태는 약속이 거부되었음을 나타냅니다.
Settled - 이 상태는 약속이 거부되었거나 이행되었음을 나타냅니다.

비동기/대기:
이는 Promise 위에 구축되었으며 비동기 코드를 작성하는 보다 간결한 방법을 제공하여 읽고 쓰기가 더 쉬워졌습니다.
async 키워드는 동기화 기능을 선언하는 데 사용되며, wait는 약속이 해결될 때까지 기다리는 데 사용됩니다.

표현형 대 구조
=>express는 어떤 값을 반환하는 것입니다
예:

function add (a) {
  return function(b){
    return a + b;
  }
}
add(3)(4)
로그인 후 복사
로그인 후 복사

5 및 myfun()이 반환하는 일부 값은 표현식입니다
동작을 지시하고 명령하지만 값을 반환하지 않는 명령문
예를 들어 if,else, while은 진술입니다
while(i<2){}

나머지 매개변수 및 스프레드 연산자:
나머지 매개변수는 별도의 요소를 배열로 결합했습니다
스프레드 연산자는 배열을 단일 요소로 분리하는 데 사용됩니다

발전기 기능 ?
중간에 정지했다가 정지한 곳부터 계속할 수 있습니다.
제너레이터 객체는 next()라는 메소드로 구성되어 있는데, 이 메소드가 호출되면 가장 가까운 Yield 문까지 코드를 실행하고 Yield 값을 반환합니다.

call(),apply() 및 바인딩():
이 모든 것은 이 키워드에 개체를 할당하는 데 사용됩니다(이 키워드에 값을 할당)
원하는 객체로 함수의 이 키워드를 조작하려는 경우의 사용 사례
bind() 메소드는 호출 시 this 키워드가 제공된 값(예: 객체)으로 설정된 새 함수를 생성합니다. 새로운 객체를 생성합니다.
call()과 apply()는 동일한 목적으로 사용됩니다. call() 메서드는 호출되는 함수의 복사본을 만들지 않습니다.
작동 방식의 유일한 차이점은 call()이 모든 매개변수가 개별적으로 전달될 것으로 예상한다는 것입니다.
반면 apply()는 모든 매개변수의 배열을 기대합니다.

IIFE:
정의하자마자 실행되는 함수를 즉시 호출했습니다.
예:

const x=5;
const y=myfun();
로그인 후 복사

순수 기능:
동일한 입력에 대해 동일한 출력을 생성합니다. 표현식의 피연산자의 데이터 유형이 다를 때 발생합니다.
외부 상태나 변수를 수정하지 않는 함수

자바스크립트는 정적 유형 언어인가요, 아니면 동적 유형 언어인가요?
동적 유형 언어에서는 정적 유형 언어와 달리 런타임 중에 변수 유형을 확인합니다.
컴파일 타임에 변수 유형을 확인하는 곳입니다.
예:
정적 유형

(function(){ 
  // Do something;
})();
로그인 후 복사

동적 유형

string name="salman"; 
// varaible has types
로그인 후 복사

코어코인:
한 데이터 유형에서 다른 데이터 유형으로 값을 자동으로 변환합니다.
문자열 강제
숫자를 문자열로 변환
- 문자열을 숫자로 변환

NaN():
isNaN() 함수는 주어진 값을 Number 유형으로 변환한 다음 NaN과 동일하게 만듭니다.

ASP 스크립트 v/s javascript ?
ASP 스크립트는 서버에서 실행되는 반면 JavaScript는 클라이언트 브라우저에서 실행됩니다.
ASP 스크립트는 데이터베이스 쿼리, 양식 제출, 사용자 인증과 같은 복잡한 작업을 처리하는 데 사용되는 서버측 언어입니다.
JavaScript는 애니메이션, 팝업 창, 양식 유효성 검사와 같은 웹페이지의 대화형 요소를 만드는 데 사용되는 클라이언트측 언어입니다.

정의되지 않은 값:
값이 정의되지 않았지만 변수가 존재합니다
객체에 속성 누락

에슬린트:
자바스크립트 코드의 일반적인 취약점을 디버깅하고 해결하는 데 도움이 됩니다

나에 대해 더 알고 싶으시면 검색창에 sallbro라고 적어주세요...

위 내용은 중급자를 위한 Javascript에 관한 모든 것의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿