es6의 새로운 선언 방법은 무엇입니까?

WBOY
풀어 주다: 2022-04-08 18:29:27
원래의
2893명이 탐색했습니다.

새로운 선언 방법: 1. 변수 선언에 사용되는 "let 변수 이름=값" 구문 2. const, 상수 선언에 사용되는 "const 상수 이름=값" 구문; 클래스 선언, 구문은 "클래스 클래스 이름 {...}"입니다. 4. 가져오기, 정적으로 로드된 입력 변수를 선언하는 데 사용됩니다.

es6의 새로운 선언 방법은 무엇입니까?

이 기사의 운영 환경: Windows 10 시스템, Vue 버전 2.9.6, DELL G3 컴퓨터.

es6의 새로운 선언 방법은 무엇입니까?

ES5 이전에는 두 가지 유형의 선언 방법이 있었습니다. 첫 번째는 변수와 상수를 선언하는 "var"입니다. 두 번째는 함수를 선언하는 "function"입니다. ES6에서는 변수 선언 방법이 6가지로 한꺼번에 확장되었으며, 정리하면 다음과 같습니다.

변수 또는 상수 선언 선언: VAR, Let(새 ES6 추가), const6(새 ES6 증가)

                                                                             사용           를 사용하여 ES 6을 사용합니다. 정의 개념:

1, let 및 const

정의:

let: ES6에서는 변수를 선언하는 let 명령을 추가합니다. 사용법은 var와 비슷하지만 선언된 변수는 let 명령이 있는 블록 수준 범위 내에서만 유효합니다. const: ES6에는 읽기 전용 상수를 선언하는 새로운 const 명령이 추가되었습니다. 한번 선언된 상수의 값은 변경할 수 없습니다. let처럼 선언된 변수는 블록 수준 범위 내에서만 유효합니다.

특징 차이점:

동일: 변수 승격이 없으므로 선언한 후에만 사용할 수 있으며, District(TDZ)를 선언하지 않으면 오류가 보고됩니다. ), 선언 없이 변수가 선언되지 않는 이유도 설명되어 있습니다.

어떤 명령문도 명령문을 반복할 수 없습니다.

차이점: const 문의 변수는 "변경되지 않은" 변수입니다. 변수를 선언할 때 직접 할당해야 합니다. 상수 할당 후에는 값을 변경할 수 없습니다. 그렇지 않으면 오류가 보고됩니다.

참고: 위에서 언급한 것처럼 const로 선언된 변수는 "상수"에 대한 것입니다. 문자열, 숫자 값, 부울 값 등과 같은 "기본 데이터 유형"이어야 합니다. 모든 데이터 유형을 참조하는 것은 아닙니다. const로 선언한 변수가 참조 데이터 유형인 경우 값이 변경될 수 있습니다.

여기서 우리는 const에 의해 저장된 내용의 진정한 의미에 대해 이야기합니다. const가 실제로 보장하는 것은 변수의 값이 변경될 수 없다는 것이 아니라 변수가 가리키는 메모리 주소에 저장된 데이터가 변경될 수 없다는 것입니다. 단순한 유형의 데이터(숫자 값, 문자열, 부울 값)의 경우 값은 변수가 가리키는 메모리 주소에 저장되므로 상수와 동일합니다.

그러나 복합 유형 데이터(주로 객체 및 배열)의 경우 변수가 가리키는 메모리 주소는 실제 데이터에 대한 포인터만 저장합니다. Const는 이 포인터가 고정되어 있다는 것만 보장할 수 있습니다(즉, 항상 다른 고정된 포인터를 가리킵니다). 주소), 그것이 가리키는 데이터 구조가 가변적인지 여부는 완전히 통제 불능입니다. 그러므로 객체를 상수로 선언할 때는 매우 주의해야 합니다.

사용법:

// let 用法
let a = '123';
 
// const 用法
const b = '456'
로그인 후 복사

2, class

정의: ES6 클래스는 단지 구문적 설탕으로 간주될 수 있습니다. 대부분의 기능은 ES5에서 달성할 수 있습니다. 새로운 클래스 작성 방법은 단지 객체를 작성하는 방법일 뿐입니다. 프로토타입은 더 명확하고 객체 지향 프로그래밍의 구문과 더 유사합니다.

(클래스는 실제로 매우 중요한 지식인 클래스를 정의합니다. 여기서는 클래스의 가장 기본적인 사용법을 간략하게 배우고 소개 역할을 합니다. 심층적인 학습 내용은 나중에 기록하겠습니다.)

사용법:

// 基本方法定义一个类
class Point{
    constructor(x,y){
        this.x = x;
        this.y = y;
    }
 
    toString(){
        return '( '+ this.x +','+ this.y +')';
    }
}
 
var point = new Point(2,3)
point.toString(); // (2,3)
 
 
// 表达式的方法定义一个类
let person = new class {
  constructor(name) {
    this.name = name;
  }
 
  sayName() {
    console.log(this.name);
  }
}('张三');
 
person.sayName(); // "张三"
로그인 후 복사

3. import 사용법

:

export 명령을 사용하여 모듈의 외부 인터페이스를 정의한 후 다른 JS 파일에서 import 명령을 통해 이 모듈을 로드할 수 있습니다.

// main.js
import { firstName, lastName, year } from './profile.js';
 
function setName(element) {
  element.textContent = firstName + ' ' + lastName;
}
로그인 후 복사

위 코드의 import 명령은 profile.js 파일을 로드하고 여기에서 변수를 입력하는 데 사용됩니다. import 명령은 다른 모듈에서 가져올 변수 이름을 지정하는 중괄호 쌍을 허용합니다. 중괄호 안의 변수 이름은 가져온 모듈(profile.js)의 외부 인터페이스 이름과 동일해야 합니다. 입력 변수의 이름을 바꾸려면 import 명령에서 as 키워드를 사용하여 입력 변수의 이름을 바꾸십시오.

import { lastName as surname } from './profile.js';
로그인 후 복사
【관련 추천: "vue.js tutorial

"】

위 내용은 es6의 새로운 선언 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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