标签: ecmascript-next

我一直在使用Babel一段时间,我很喜欢它.但是,在主页上列出了支持的功能,它说Async functions.

我做了很多谷歌搜索,而我似乎只能理解它是一个ES7功能.

请问什么是ES7异步功能？

我在JavaScript中使用类属性(静态和普通)和装饰器.有没有办法启用其他ES阶段进行代码突出显示或禁用它们的特定错误消息？

VSCode告诉我,我只能在TypeScript中使用类属性,因此它似乎可以识别它们.

我试图利用es7异步功能,即

async function stepVerifyIdentity(nextState, replace, callback) {
    const val1 = await promise1('Param1')
    const val2 = await promise2('Param2')
    const val3 = await promise3('Param3')
    if (!val1 && (!val2 || !val3)) {
        console.log('Do something')
    } 
}

这里所有promise*函数都进行ajax调用并返回true或者false如果ajax响应满足传递的参数,我相信我不能连续使用3个等待,因此需要一种方法来等待所有这些调用返回它们的值不知何故.

我正在玩分配和建议的对象扩展语法,我想知道是否有办法只分配一个条件的东西？

例如,我目前有以下内容:

const requestHeaders = { ...headers };

if (accessToken) {
    requestHeaders.Authorization = `Bearer ${accessToken}`;
}

const h = {
    Accept: 'application/json',
    ...requestHeaders,
},

我想用这样的东西简化它:

const requestHeaders = {
    ...headers, {
        Authorization: accessToken ? `Bearer ${accessToken}` : void 0, // I don't want Authorization to appear in the object if it's null or undefined, but this doesn't work
    }
};

const h = {
    Accept: 'application/json',
    ...requestHeaders,
},

有没有办法有条件地为对象分配属性？

谢谢

我有一个结构简化的对象，如下所示：

state = {
  todo: {
    1: {text: 'Buy apples'},
    2: {text: 'Buy milk'}
  }
}

如果我想删除待办事项的不变性，根据 Stack Overflow 上的其他答案，我可以解构待办事项列表：

const idToDelete = 2

let {
  [idToDelete]: deleted,
  ...newTodo
} = state.todo

如果我这样做console.log(newTodo)，那么它具有相同的值state.todo，这意味着它没有删除到 id 为 2 的待办事项。如果我 console.log(deleted)然后它返回我想删除的待办事项的内容：{text: 'Buy milk'}。

我知道使用诸如 Immutable.js 之类的库来管理它会更容易一些，但是我想知道为什么解构对象不会删除待办事项项。谢谢。

我需要调用一个异步函数来获取我的身份验证令牌。在导出中，我想包含此 fn 的返回值。

我的第一次尝试：

const token = await sessionHandler.getToken();

export const httpService = axios.create({
    ...
    headers: {
        "auth-token": token
        ...
    }
});

当然这不起作用，因为await它不在异步函数中。所以我可以把它包装在一个异步函数中，对吗？不，因为我必须使用回调。再说一次，我不会在顶级导出，这也不起作用。

解决这个问题的最佳方法是什么？

我对提出的JavaScript do expression构造有疑问。有许多示例说明如何使用它从同时具有if和的条件语句中返回值else。对于if和else if和也有效else。

那只有一个if子句但没有else if或没有的条件else呢？这是do表达式的有效用法吗？

我的用例是有条件地在React组件中显示内容。我想这样写JSX代码，但不确定它是否有效：

export default function myComponent(props) {
  return (
    <div>
      {do {
        if (true) {
          <p>If statement is true</p>
        }
      }}
      <p>I am always rendered</p>
    </div>
  );
}

我还问了这个要点的问题。

多个axios字体中的错误-令人敬畏的历史资料-ui道具类型react-bootstrap react-dom react-foundation react-redux react-router react-router-dom recharts redux redux-saga找不到模块：错误：无法解析'/ Users / user / Documents / psbank / pslite_web'中的'font-awesome'@多axios font-awesome历史资料-ui道具类型react-bootstrap react-dom react-foundation react-redux react-router react-router -dom记录redux redux-saga

.webpack.config.js:

const webpack = require("webpack");
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");

const VENDOR_LIBS = [
  'axios', 'font-awesome', 'history',
  'material-ui', 'prop-types', 'react',
  'react-bootstrap', 'react-dom', 'react-foundation', 'react-redux', 'react-router', 'react-router-dom', 'recharts', 'redux', 'redux-saga'
];

module.exports = {
  entry: {
    bundle: ["babel-polyfill", "./src/index.js"],
    vendors: VENDOR_LIBS
  },
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: …

我试图让对象传播运算符与我的反应项目一起工作。它出现了一个语法错误：

我已经尝试babel-plugin-transform-object-rest-spread按照 babel docs 的描述使用。

经过一番研究，我还尝试了babel 的GitHub 问题中描述的配置：

请参阅下面的我的.babelrc文件：

{
    "presets": ["es2015"],
    "plugins": ["transform-object-rest-spread"],
    "sourceMaps": true,
    "retainLines": true
}

我的webpack.config文件如下：

const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'public', 'js'),
    publicPath: '/'
  },
  devtool: 'source-map',
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        include: path.resolve(__dirname, 'src'),
        loader: 'babel-loader',
        options: {
          presets: ['react', 'es2015']
        }
      },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      },
      {
        test:/\.scss$/,
        use: …

这是我的 tsconfig.json 文件：

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "es2015",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es6",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  }
}

当我将 lib 和目标版本更改为 es2020 时，它给了我以下错误：

tsconfig.json(13,15)：错误 TS6046：“--target”选项的参数必须是：“es3”、“es5”、“es6”、“es2015”、“es2016”、“es2017”、“es2018” ，'esnext'。