当前位置：首页 > 软件库 > Web应用开发 > 常用JavaScript包 >

esnext

ES6 转 JavaScript

授权协议 Apache

开发语言 JavaScript

所属分类 Web应用开发、常用JavaScript包

软件类型开源软件

地区不详

投递者姜良哲

操作系统跨平台

开源组织无

适用人群未知

软件概览

esnext 是一个 JavaScript 库，可以将 ES6 草案规范语法转成今天的 JavaScript 语法。

例如：

/*
On the left is code written with new JavaScript features,
and on the right is the console output, plus the same code
re-written so it can run in today's browsers.

Edits made to the code on the left will re-generate and
re-run the code on the right. Try it out!
*/

// Classes
class Person {
  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }

  get name() {
    // Template strings
    return `${this.firstName} ${this.lastName}`;
  }

  toString() {
    return this.name;
  }
}

console.log(
  'Full name is:',
  new Person('Michael', 'Bluth')
);

// Arrow functions
console.log([1, 2, 3].map(x => x * x));

// Rest params
function join(delim, ...items) {
  return items.join(delim);
}

// Spread args
console.log(join('-', ...[415, 555, 1212]));

将被转换成：

/*
On the left is code written with new JavaScript features,
and on the right is the console output, plus the same code
re-written so it can run in today's browsers.

Edits made to the code on the left will re-generate and
re-run the code on the right. Try it out!
*/

// Classes
var $__Array$prototype$slice = Array.prototype.slice;
var $__Object$defineProperties = Object.defineProperties;

var Person = function() {
  "use strict";

  function Person(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }

  $__Object$defineProperties(Person.prototype, {
    name: {
      get: function() {
        // Template strings
        return "" + this.firstName + " " + this.lastName + "";
      },

      enumerable: true,
      configurable: true
    },

    toString: {
      value: function() {
        return this.name;
      },

      enumerable: false,
      writable: true
    }
  });

  $__Object$defineProperties(Person, {});
  return Person;
}();

console.log(
  'Full name is:',
  new Person('Michael', 'Bluth')
);

// Arrow functions
console.log([1, 2, 3].map(function(x) {
  return x * x;
}));

// Rest params
function join(delim) {
  var $__arguments = arguments;
  var items = [].slice.call($__arguments, 1);
  return items.join(delim);
}

// Spread args
console.log(join.apply(null, ['-'].concat($__Array$prototype$slice.call([415, 555, 1212]))));

使用方法：

var transpiler = require('es6-module-transpiler');
var Container = transpiler.Container;
var FileResolver = transpiler.FileResolver;
var BundleFormatter = transpiler.formatters.bundle;

var container = new Container({
  resolvers: [new FileResolver(['lib/'])],
  formatter: new BundleFormatter()
});

container.getModule('index');
container.write('out/mylib.js');

使用案例

ESNEXT（ES6及以后）常用API解析

ES6及以后新增的常用API解析注：例子建立在非严格模式下，新版chrome浏览器下严格模式下：window为undefined node下：window为global let和const和var的区别 for(var i = 0 ; i < 3 ; i++){ setTimeout(()=>{ console.log(i); },0) } 输出 3 3 3 为什么
ES6及ESNext规范详解

1、ECMAScript规范发展 ES6：指2015年6月发布的ES2015标准，但是很多人在谈及ES6的时候，都会把ES2016、ES2017等标准的内容也带进去 ESNext：泛指，它永远指向下一个版本，如当前最新版本是ES2021，那么ESNext指的即是2022年6月将要发布的标准 2、ES6常用API 1、let和const 引入块级作用域暂时性死区：不允许变量提升 for (var
JS+esNext数组方法

数组方法数组的常用方法方法作用影响原数组 push 在数组后添加元素，返回数组长度 √ pop 删除数组的最后一项，返回被删除项 √ shift 删除数组第一项，并返回被删除项 √ unshift 数组开头添加元素，返回新数组长度 √ reserve 反转数组，返回修改后的数组
ES6/ESNext规范学习笔记

课程名称 ES6/ESNext规范 ES6/ESNext 规范详解 ES6/ESNext 规范详解课程目标 1.简单了解ECMAScript规范发展及历史（每年6月发一版） 2.ES6及以后新增的常⽤API解析 3.简单了解一下Babel.js,写一个插件课程要点 1.let 和 const for(var i=0;i<=3;i++){ setTimeout(function() {
angular 仅当 “module” 选项设置为 “esnext” 或 “system”，并且 “target” 选项设置为 “es2017” ...

仅当 “module” 选项设置为 “esnext” 或 “system”，并且 “target” 选项设置为 “es2017” 或更高版本时，才允许使用顶级 “await” 表达式。ts(1378) tsconfig.ts修改"module": “esnext”, { "compileOnSave": false, "compilerOptions": { "baseUrl":
仅当 “module“ 选项设置为 “esnext“ 或 “system“，并且 “target“ 选项设置为 “es2017“ 或更高...

仅当 “module” 选项设置为 “esnext” 或 “system”，并且 “target” 选项设置为 “es2017” 或更高版本时，才允许使用顶级 “await” 表达式。ts(1378) { "compileOnSave": true, "compilerOptions": { "moduleResolution": "node", "alwaysStrict
meta-property is only allowed when the ‘--module‘ option is ‘es2020‘, ‘esnext‘...

修改tsconfig.json { "compilerOptions": { "module": "es2022", "moduleResolution": "Node" }, }
esnext —— 将 ES6 转成 JavaScript 代码

esnext 是一个 JavaScript 库，可以将 ES6 草案规范语法转成今天的 JavaScript 语法。例如： /* On the left is code written with new JavaScript features, and on the right is the console output, plus the same code re-written so it
webpack4.x 配置调试、babel配置编译ESnext、JSX

调试 webpack4.x 开启调试 --mode development webpack3.x之前在webpack.config.js中添加 devtool: 'source-map', //开启调试功能,上线之前需将此行注释 babel:编译JS -babel用来编译js - 让你很轻松的使用ES6 7 等,帮助转化在src下新建一个src/js/a.js export const
wsjls-zw：14、ES6、ESNext规范

ES6 ES2015是主要的版本 ES2018 增加了rest和spread语法 ES2020 第11版 ES的下一个版本是ESnext ## ES6及以后新增常用API #### let const for (var i=0;i<=3;i++) { setTimeout(function(){ console.log(i) },10) } 原因： 1、var 全局变量，只
Ts ES2022，ESNext 环境下属性修饰器失效

当tsconfig.json中的target 设置为ESNext 或者ES2022时，属性修饰器会失效。因为在新的版本下useDefineForClassFields这个属性默认设置为true，https://github.com/microsoft/TypeScript/issues/48814 失效原因 useDefineForClassFields : 发出符合ECMAScript标准的类字
[ESNext]现在就学起来：class

ES5 及之前定义在 ES5 中，并没有类的概念，但是已经有了类型的概念。那时，我们想创建一个类型，是这样做的： function MyClass() { alert(this instanceof MyClass); } 如此，我们定义了一个类型，但同时，他也是一个函数。我们看看不同调用方法所得到的结果： MyClass(); // false new MyClass(); //

esnext

同类工具

相关阅读

相关文章

相关问答

相关文档