标签: ecmascript-7

我正在处理我的第一个ES6应用程序,angular2并且在使用es7装饰器语法时无法使其工作.

entry.js

import * as stylesheet from '../assets/styles/app.scss';

import $ from 'jquery';
import jQuery from 'jquery';
// export for others scripts to use
window.$ = $;
window.jQuery = jQuery;

import './boot'
import {AppComponent} from './app.component'

boot.js

(function (app) {
    document.addEventListener('DOMContentLoaded', function () {
        ng.platform.browser.bootstrap(app.AppComponent);
    });
})(window.app || (window.app = {}));

app.component.js

import {Component} from 'angular2/core';

@Component({
    selector: 'my-app',
    template: '<h1>My First Angular 2 App</h1>'
})
export class AppComponent {
    constructor() {

    }
}

的package.json

{
  "main": …

与es6/es7不同,Typescript的语法明智不同.我们在Typescript中有这样的代码:

class demo {
    demoProp:any;
    constructor () {
        //...
    }
}

但是es6不要求:any财产后申报吗？所以我应该继续使用Typescript,还是应该es6直接学习,因为它是标准的JavaScript.注意: - 我知道TypeScript据说是基于类型的,也是超集的es6.但ecma script 可能会TypeScript在不久的将来或下一个版本7或8

我想在我的项目中包含es7函数,以开始在其中使用fetch等待异步方式.

我正在使用gulp,browserify和babelify(7.2.0),阅读一些文档,我看到说babelify使用es7函数的方法是将这一行包含在babelify转换中:

optional: ['runtime', 'es7.asyncFunctions']

所以我的整个任务如下:

gulp.task('js',function(){



var bundleStream = browserify({

    entries:[config.paths.mainJs],
    debug: true,

    transform: [babelify.configure({
        presets:["es2015","react"],
        optional: ['runtime', 'es7.asyncFunctions']
    })]


}).transform("browserify-shim")
    .bundle()
    .on('error',console.error.bind(console))




bundleStream
    .pipe(source('compiled.js'))
    .pipe(buffer())
   // .pipe(uglify())
    .pipe(rename('compiled.min.js'))
    .pipe(gulp.dest(config.paths.dist + '/js'))


});

不幸的是,运行任务时出现以下错误:

"未知选项:解析文件时的base.optional:"

谷歌搜索有点我看到babelify 7.x确实使用babel 6.0,显然这个参数可选在babel 6.0中不再存在.

我不想降级我的babelify版本来使这项工作,但我想包括es7功能与babelify版本7,有人知道如何做到这一点？

任何帮助将非常感激,因为没有太多关于它的信息

为了以防万一,请查找我的package.json文件:

"dependencies": {
"bootstrap": "^3.3.5",
"history": "^1.13.0",
"jquery": "^2.1.4",
"jquery-ui": "^1.10.4",
"jquery.easing": "^1.3.2",
"moment": "^2.10.2",
"react": "^0.14.3",
"react-bootstrap": "^0.28.1",
"react-dom": "^0.14.3",
"react-router": "^1.0.2",
"reflux": "^0.3.0"
},
"devDependencies": {
"babel-preset-es2015": "^6.1.18",
"babel-preset-react": "^6.1.18",
"babelify": "^7.2.0",
"browserify": "^9.0.8",
"browserify-shim": "^3.8.11", …

我试图证明一个简单的函数调用,如

window.alert();

是有效的EcmaScript 2016(第7版)语法.落后的工作,并期望这是一个ExpressionStatement,我看到它适合的模式MemberExpression参数是一个CallExpression.并且,第12.3节将LeftHandSideExpression定义为可能是CallExpression.现在,我的问题是12.15 节AssignmentExpression似乎要求 LeftHandSideExpression后跟AssignmentExpression或AssignmentOperator,而AssignmentExpression不能;

我可能错过了一些简单的东西.方向将非常感谢.

假设我在页面中插入了一个外部javascript,它将一些东西导出到外部作用域(即将它们绑定到窗口).

我想在我的打字稿项目中调用其中一些属性:

UndeclaredExportedProperty.aFunction()

但是打字稿不允许我编译那个> <

我不想通过一种复杂的方式来声明模块的整个界面,因为我不知道它,坦率地说我并不关心它.它只是一个模块,我必须调用一次并"信任",当我调用它加载并包含正确的元素时(它非关键,所以不调用它不会让世界着火).

使用打字稿最简单的方法是什么？

编辑以响应标记为重复:

虽然这个问题的答案确实解决了我的问题,但问题是不同的(例如堆栈无法将其作为重复的建议)并且我觉得我正在尝试做什么Pokus的答案是更直接的一般解决方案而不是那个问题的答案

话虽这么说,如果管理员觉得这仍然是重复或简单的问题随时删除/关闭,因为我得到了我的答案.就个人而言,我会留下它,因为通过谷歌搜索的下一个人可能会更容易找到答案.

我正在创建一个异步迭代的数组(为了好玩).这很好用:

class AsyncArray extends Array {
    constructor() {
        super();
        this.x = 0;
    }

    [Symbol.iterator]() {
        return {
            next: () => {
                let promise = new Promise(resolve => setTimeout(
                    () => resolve(this.x++), 1000)
                );
                return {done: this.x >= this.length, value: promise};
            }
        };
    }
}

async () => {
    for (let x of AsyncArray.of(1, 2, 3)) {
        let value = await x;
        console.log(value);
    }
}();

然而,这打印出来0...1...2是因为我正在跟踪我自己的当前计数器并将其初始化为x.

有没有办法让当前的迭代器值在数组内部？我还需要能够正确地确定done价值.

我正在通过POST请求注册用户。

为此，我将axios与async / await一起使用！但是，我遇到了register.then is not a function错误。请帮帮我。

async sendUserData() {
  try {
    const register = await axios.post('/register', {
      email: this.register.email.trim(),
      password: this.register.password.trim(),
    });
    register.then(
      response => {
        console.log(response);
      }
    );
  } catch (e) {
    console.log(e);
  }
}

我想解构一个对象并排除一个属性.

这就是我现在正在做的事情:

 let x = {a:1, b:2, c:3};
 let y = {...x};
 delete y.c;
 store.setState(y);

我发现了一篇关于ES7的文章,该文章指出有一个新功能可以排除属性.所以上面会写成这样的:

 let x = {a:1, b:2, c:3};
 store.setState({c, ...x});

https://codeburst.io/use-es2015-object-rest-operator-to-omit-properties-38a3ecffe90

以上在Angular 7中不起作用,我得到以下错误:

error TS2663: Cannot find name 'c'. Did you mean the instance member 'this.c'?

我目前正在运行TypeScript 3.1.6,而我的tsconfig.app.json文件看起来像这样.

{
    "extends": "../tsconfig.json",
    "compilerOptions": {
        "outDir": "../out-tsc/app",
        "module": "es2015",
        "types": []
    },
    "exclude": [
        "src/test.ts",
        "**/*.spec.ts"
    ]
}

这是父文件.

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "importHelpers": true,
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node", …

我有一个对象:

obj = {name:null, lastName:null, scores:[]}

我需要迭代并检查所有字段是否为空,除了score字段.我需要跳过它.

我在用

  Object.values(obj).every(x=> x===null) 

在添加分数之前,但我不确定如何跳过该字段.因为无论score数组是否为空,如果所有其他字段都为null,我需要返回true.

任何建议表示赞赏