목차
Arrow 함수
类 Class
增强的对象字面量
模板字符串
解构赋值
Default + Rest + Spread
Let + Const
클래스는 승격을 선언하지 않으므로 호출하기 전에 승격이 선언되었는지 확인해야 합니다.
웹 프론트엔드 JS 튜토리얼 JS--ES 2015/6 새로운 기능 요약

JS--ES 2015/6 새로운 기능 요약

Jun 26, 2017 pm 12:01 PM
요약 특성

ES 2015/6에는 새로운 콘텐츠가 많이 포함되어 있습니다. 다음은 이러한 기능에 대한 개요(포괄적이지는 않음) 목록입니다. 사실, 파고드는 지점마다 많은 지식이 있을 것이다. 본 글은 이를 요약하는 것을 목적으로 하기 때문에 이러한 특징에 대해 깊이 있는 논의와 연구를 진행하지는 않을 것이다. 그런 다음 시간이 있으면 몇 개의 별도 블로그를 작성하여 일반적으로 사용되는 요점을 더 깊이 파고들고 모든 사람들과 심도 있는 교류를 하도록 하겠습니다.

Arrow 함수

=> 구문을 통해 구현된 함수의 짧은 형식인 화살표 함수는 C#/JAVA8/CoffeeScript에서 유사한 구문을 갖습니다. 함수와 달리 화살표 함수는 실행 컨텍스트와 동일한 this를 공유합니다. 함수 개체 내부에 화살표 함수가 나타나면 해당 함수와 arguments 변수를 공유합니다. => 语法实现的函数简写形式,C#/JAVA8/CoffeeScript 中都有类似语法。与函数不同,箭头函数与其执行下文环境共享同一个 this。如果一个箭头函数出现在一个函数对象内部,它会与这个函数共享 arguments 变量。


// Expression bodiesvar odds = evens.map(v => v + 1);var nums = evens.map((v, i) => v + i);// Statement bodiesnums.forEach(v => {
  if (v % 5 === 0)    fives.push(v);});// Lexical thisvar bob = {
  _name: "Bob",
  _friends: ['jim'],
  printFriends() {
    this._friends.forEach(f =>
      console.log(this._name + " knows " + f)); // Bob knows jim
  }};// Lexical argumentsfunction square() {
  let example = () => {
    let numbers = [];
    for (let number of arguments) {
      numbers.push(number * number);
    }

    return numbers;
  };

  return example();}square(2, 4, 7.5, 8, 11.5, 21); // returns: [4, 16, 56.25, 64, 132.25, 441]
로그인 후 복사


类 Class

Javascript 并不是引入了一个新的面向对象的对象继承模型,而是基于原型继承的语法糖。其提供了一个更简单和清晰的语法来创建对象并处理继承。


class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }}
로그인 후 복사


类没有声明提升,必须确保在调用前已经进行了声明。

构造函数 constructor 是一个特殊的方法,其用于创建和初始化类的实例。

静态方法 static 关键字用于声明静态方法

创建子类 extends 关键字用于创建子类,这里要注意:extends 不能用于扩展常规对象(不可构造/非构造的),如果要继承常规对象,可使用 Object.setPrototypeOf()

调用超类 super 关键字可以用来调用父类中的方法

Mix-ins 混合

增强的对象字面量

通过字面量形式可以实现,定义prototype、键值对简写、定义方法等、动态属性名称。


var obj = {
    // Sets the prototype. "__proto__" or '__proto__' would also work.
    __proto__: theProtoObj,
    // Computed property name does not set prototype or trigger early error for
    // duplicate __proto__ properties.
    ['__proto__']: somethingElse,
    // Shorthand for ‘handler: handler’
    handler,
    // Methods
    toString() {
     // Super calls
     return "d " + super.toString();
    },
    // Computed (dynamic) property names
    [ "prop_" + (() => 42)() ]: 42};
로그인 후 복사


模板字符串

模板字符串 提供构造字符串的语法糖,在 Prel/python 等语言中也都有类似特性。


// Basic literal string creation
`This is a pretty little template string.`

// Multiline strings
`In ES5 this is
 not legal.`

// Interpolate variable bindings
var name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`

// Unescaped template strings
String.raw`In ES5 "\n" is a line-feed.`

// Construct an HTTP request prefix is used to interpret the replacements and construction
GET`http://foo.org/bar?a=${a}&b=${b}
    Content-Type: application/json
    X-Credentials: ${credentials}
    { "foo": ${foo},
      "bar": ${bar}}`(myOnReadyStateChangeHandler);
로그인 후 복사

解构赋值

Destructuring 法是一个Javascript表达式,这使得可以将值从数组或属性从对象提取到不同的变量中。

// list matching
var [a, ,b] = [1,2,3];
a === 1;
b === 3;

// object matching (用新变量名赋值)
var { op: a, lhs: { op: b }, rhs: c }
       = getASTNode()

// object matching shorthand
// binds `op`, `lhs` and `rhs` in scope
var {op, lhs, rhs} = getASTNode()

// Can be used in parameter position
function g({name: x}) {
  console.log(x);
}
g({name: 5})

// Fail-soft destructuring
var [a] = [];
a === undefined;

// Fail-soft destructuring with defaults
var [a = 1] = [];
a === 1;

// 变量可以先赋予默认值。当要提取的对象没有对应的属性,变量就被赋予默认值。
var {a = 10, b = 5} = {a: 3};
console.log(a); // 3
console.log(b); // 5

// Destructuring + defaults arguments
function r({x, y, w = 10, h = 10}) {
  return x + y + w + h;
}
r({x:1, y:2}) === 23

// 对象属性计算名和解构
let key = "z";
let { [key]: foo } = { z: "bar" };

console.log(foo); // "bar"
로그인 후 복사

Default + Rest + Spread

为函数参数提供默认值 & ... 定数量参数

function f(x, y=12) {
  // y is 12 if not passed (or passed as undefined)
  return x + y;
}
f(3) == 15


function f(x, ...y) {
  // y is an Array
  return x * y.length;
}
f(3, "hello", true) == 6



function f(x, y, z) {
  return x + y + z;
}
// Pass each elem of array as argument
f(...[1,2,3]) == 6
로그인 후 복사

Let + Const

let 用于声明块级作用域变量。 const

function f() {
  {
    let x;
    {
      // this is ok since it's a block scoped name
      const x = "sneaky";
      // error, was just defined with `const` above
      x = "foo";
    }
    // this is ok since it was declared with `let`
    x = "bar";
    // error, already declared above in this block
    let x = "inner";
  }
}
로그인 후 복사

Class Class

Javascript Class는 새로운 객체 지향 객체 상속 모델을 도입하지 않고 프로토타입 상속 구문을 기반으로 합니다. 설탕. 객체 생성 및 상속 처리를 위한 더 간단하고 명확한 구문을 제공합니다.

let fibonacci = {
  [Symbol.iterator]() {
    let pre = 0, cur = 1;
    return {
      next() {
        [pre, cur] = [cur, pre + cur];
        return { done: false, value: cur }
      }
    }
  }
}

for (var n of fibonacci) {
  // truncate the sequence at 1000
  if (n > 1000)
    break;
  console.log(n);
}
로그인 후 복사

클래스는 승격을 선언하지 않으므로 호출하기 전에 승격이 선언되었는지 확인해야 합니다.

생성자 <code>생성자</code>는 클래스의 인스턴스를 생성하고 초기화하는 데 사용되는 특수 메서드입니다. 🎜🎜정적 메서드 <code>static</code> 키워드는 정적 메서드를 선언하는 데 사용됩니다. 🎜🎜하위 클래스 만들기 <code>extends</code> 키워드는 하위 클래스를 만드는 데 사용됩니다. 여기서 참고하세요: 확장은 일반 개체를 확장하는 데 사용할 수 없습니다. (비구성 가능/비구성 가능), 일반 객체에서 상속하려면 <code>Object.setPrototypeOf()</code>를 사용할 수 있습니다. 🎜🎜호출 슈퍼 클래스 <code>super</code> 키워드를 사용하여 상위 클래스의 메소드를 호출할 수 있음 🎜🎜<code>믹스인</code> 혼합 🎜🎜향상된 객체 리터럴 🎜🎜리터럴 형식을 통해 가능 프로토타입, 키-값 쌍 약어, 메소드 정의 등 및 동적 속성 이름을 정의하여 구현됩니다. 🎜<p class="sourceCode">🎜🎜<pre class="brush:js;toolbar:false;">function* quips(name) {
  yield "你好 " + name + "!";
  yield "希望你能喜欢这篇介绍ES6的译文";
  if (name.startsWith("X")) {
    yield "你的名字 " + name + "  首字母是X,这很酷!";
  }
  yield "我们下次再见!";
}
로그인 후 복사
🎜🎜🎜🎜템플릿 문자열🎜🎜템플릿 문자열은 문자열 구성을 위한 구문 설탕을 제공하며 Prel/python과 같은 언어에서 유사한 기능을 제공합니다. 🎜

🎜🎜rrreee🎜구조 분해 할당🎜🎜구조 분해 방법은 배열의 값이나 객체의 속성을 다른 변수로 추출할 수 있게 해주는 자바스크립트 표현식입니다. 🎜rrreee🎜Default + Rest + Spread🎜🎜함수 매개변수 및 ... 고정 개수의 매개변수에 대한 기본값 제공🎜rrreee🎜Let + Const🎜🎜let은 선언 블록 수준 범위 변수에 사용됩니다. const는 상수를 선언하는 데 사용됩니다. 🎜rrreee🎜Iterator🎜🎜symbol.iterator를 사용하여 사용자 정의 반복자를 만드세요. 🎜rrreee🎜🎜🎜🎜Generators🎜🎜일반 함수는 함수 선언을 사용하는 반면, 생성기 함수는 function* 선언을 사용합니다. 🎜🎜생성기 함수 안에는 return과 유사한 구문이 있습니다. 바로 키워드 Yield입니다. 둘 사이의 차이점은 일반 함수는 한 번만 반환할 수 있는 반면, 생성기 함수는 여러 번 반환할 수 있다는 것입니다(물론 한 번만 반환할 수도 있습니다). 생성기 실행 중에 항복 표현식이 나타나면 즉시 일시 중지되며 나중에 실행 상태를 재개할 수 있습니다. 🎜rrreee🎜Unicode🎜🎜// ES5.1과 동일 "

위 내용은 JS--ES 2015/6 새로운 기능 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

win7 홈 버전과 win7 최종 버전의 차이점 소개 win7 홈 버전과 win7 최종 버전의 차이점 소개 Jul 12, 2023 pm 08:41 PM

Win7 Ultimate 버전, Win7 Professional 버전, Win7 Home 버전 등과 같은 Win7 시스템 버전이 많다는 것은 누구나 알고 있습니다. 많은 사용자가 Home 버전과 Ultimate 버전 사이에서 얽혀 어떤 버전을 선택해야 할지 모릅니다. 그래서 오늘은 Win7 Family Meal과 Win7 Ultimate의 차이점에 대해 말씀드리겠습니다. 1. Different Home Basic Edition을 경험해 보세요. 일상적인 작업을 더 빠르고 간단하게 만들어 가장 자주 사용하는 프로그램과 문서에 더 빠르고 편리하게 액세스할 수 있습니다. Home Premium은 좋아하는 TV 프로그램, 사진, 비디오 및 음악을 쉽게 즐기고 공유할 수 있는 최고의 엔터테인먼트 경험을 제공합니다. Ultimate Edition은 각 에디션의 모든 기능을 통합하고 Windows 7 Home Premium의 모든 엔터테인먼트 기능과 전문 기능을 갖추고 있습니다.

Spring MVC의 주요 개념을 익히십시오: 이러한 중요한 기능을 이해하십시오 Spring MVC의 주요 개념을 익히십시오: 이러한 중요한 기능을 이해하십시오 Dec 29, 2023 am 09:14 AM

SpringMVC의 주요 기능 이해: 이러한 중요한 개념을 익히려면 특정 코드 예제가 필요합니다. SpringMVC는 개발자가 MVC(Model-View-Controller) 아키텍처 패턴을 통해 유연하고 확장 가능한 구조를 구축하는 데 도움이 되는 Java 기반 웹 애플리케이션 개발 프레임워크입니다. 웹 애플리케이션. SpringMVC의 주요 기능을 이해하고 익히면 웹 애플리케이션을 보다 효율적으로 개발하고 관리할 수 있습니다. 이 기사에서는 SpringMVC의 몇 가지 중요한 개념을 소개합니다.

5g의 3가지 특징은 무엇인가 5g의 3가지 특징은 무엇인가 Dec 09, 2020 am 10:55 AM

5G의 세 가지 특징은 다음과 같습니다. 1. 고속, 실제 응용 분야에서 5G 네트워크의 속도는 4G 네트워크의 10배 이상입니다. 2. 낮은 대기 시간: 5G 네트워크의 대기 시간은 약 수십 밀리초로 인간의 반응 속도보다 빠릅니다. 3. 폭넓은 연결성, 5G 네트워크의 출현은 다른 기술과 결합하여 만물인터넷(Internet of Everything)의 새로운 장면을 창출할 것입니다.

Golang에 클래스와 유사한 객체지향 기능이 있나요? Golang에 클래스와 유사한 객체지향 기능이 있나요? Mar 19, 2024 pm 02:51 PM

Golang(Go 언어)에는 전통적인 의미의 클래스 개념이 없지만, 클래스와 유사한 객체지향 기능을 구현할 수 있는 구조체라는 데이터 형식을 제공합니다. 이 기사에서는 구조를 사용하여 객체 지향 기능을 구현하는 방법을 설명하고 특정 코드 예제를 제공합니다. 구조의 정의와 사용법 먼저 구조의 정의와 사용법을 살펴보자. Golang에서는 type 키워드를 통해 구조를 정의한 다음 필요한 곳에 사용할 수 있습니다. 구조에는 속성이 포함될 수 있습니다.

필요와 기능에 따라 해당 Go 버전을 선택하세요. 필요와 기능에 따라 해당 Go 버전을 선택하세요. Jan 20, 2024 am 09:28 AM

인터넷의 급속한 발전으로 프로그래밍 언어는 끊임없이 진화하고 업데이트되고 있습니다. 그 중 오픈소스 프로그래밍 언어인 Go 언어는 최근 몇 년간 많은 주목을 받고 있습니다. Go 언어는 간단하고 효율적이며 안전하고 개발 및 배포가 용이하도록 설계되었습니다. 높은 동시성, 빠른 컴파일, 메모리 안전성 등의 특징을 갖고 있어 웹 개발, 클라우드 컴퓨팅, 빅데이터 등 분야에서 널리 사용됩니다. 그러나 현재 다양한 버전의 Go 언어를 사용할 수 있습니다. 적합한 Go 언어 버전을 선택할 때 요구 사항과 기능을 모두 고려해야 합니다. 머리

Win11 오류 및 문제 정리 Win11 오류 및 문제 정리 Jan 13, 2024 pm 08:21 PM

win11을 업데이트하고 싶은데 win11에 버그가 많은지, 업데이트로 인해 문제가 발생할지는 잘 모르시는 분들도 계십니다. 사실 현재 win11에도 버그가 있지만 사용에 미치는 영향은 거의 없습니다. win11에 버그가 많나요? 답변: win11에는 여전히 버그가 많습니다. 그러나 이러한 버그는 일상적인 사용에 거의 영향을 미치지 않습니다. 사용자가 일상적인 사용에 대한 요구 사항이 높은 경우 나중에 사용하는 것이 좋습니다. win11 버그 요약 1. 리소스 관리자 1. 가끔 메모리 오버플로가 발생하여 리소스 관리자의 메모리 사용량이 많아지는 경우가 있습니다. 2. 이 상황에서는 메모리 사용량이 70%를 초과하여 컴퓨터가 정지되거나 심지어 충돌이 발생할 수 있습니다. 2. 충돌 및 충돌 1. 일부 애플리케이션은 호환이 충분하지 않아 서로 충돌이 발생합니다. 2. 분쟁절차가 상대적으로 적음에도 불구하고,

PHP 문자열 대체 함수 요약 PHP 문자열 대체 함수 요약 Jun 21, 2023 am 09:39 AM

강력한 프로그래밍 언어인 PHP는 풍부한 문자열 처리 기능을 제공합니다. 인터넷이 발전하면서 문자열 처리는 점점 웹 개발에서 없어서는 안 될 부분이 되었습니다. PHP에서는 문자열 교체 기능을 사용하여 문자열에서 특정 텍스트를 검색하고 교체합니다. 다음은 PHP에서 일반적으로 사용되는 문자열 대체 함수를 요약한 것입니다. str_replace str_replace 함수는 PHP에서 가장 일반적으로 사용되는 문자열 교체 함수 중 하나입니다. 문자열의 특정 부분 문자열을 바꿀 수 있습니다. 이 함수의 구문은 다음과 같습니다

C++ 함수 유형 및 특성 C++ 함수 유형 및 특성 Apr 11, 2024 pm 03:30 PM

C++ 함수에는 단순 함수, const 함수, 정적 함수 및 가상 함수 유형이 있습니다. 기능에는 인라인 함수, 기본 매개변수, 참조 반환 및 오버로드된 함수가 포함됩니다. 예를 들어,calculateArea 함수는 π를 사용하여 주어진 반경의 원의 면적을 계산하고 이를 출력으로 반환합니다.

See all articles