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 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');
文章转载自 开源中国社区 [http://www.oschina.net]
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
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值