标签: ecmascript-5

在function类型对象中，length属性表示类型对象所需的参数数量function。例如，在下面的可视化中，对象objectlength中的字段的值为。FunctionArray1

在上面的可视化中，lengthfield 也是objectobject 类型的成员Array.prototype，其值为0。

MDN说：

Array.prototype.length反映数组中元素的数量。

cars遵循下面的&bikes数组中的定义，

var cars = new Array("Saab", "Volvo", "BMW");
var bikes = ["Honda", "Yamaha"];

cars.__proto__.length＆bikes.__proto__.length还是0。

多个数组对象( cars, bikes) 不能共享与 中的属性相同的length属性值。lengthArray.prototype

1）

根据MDN，这是一个正确的定义吗？

2）

length如果不是，字段中的含义是什么Array.prototype？

TypeScript 可以全局定位不同版本的 Javascript - 您可以在转译 ES3、ES5 或 ES6 之间切换。

我们必须支持 IE，所以 ES3 是我们的最低公分母。

然而，好的浏览器（如 Chrome）已经支持 ES6，并且能够通过优化运行明显更小的 ES6 代码。

因此，我想从同一个 TypeScript 源为 IE 提供 ES3，为 Chrome 提供 ES6。

• 有没有办法让 TypeScript 转译多个 JS 文件（可能是*.es3和*.es6或类似的东西），以便我们可以选择要提供的版本？（最好是 VS 2015）

• 或者，在 C# 中，我可以访问 TypeScript 转译器以在运行时完成该步骤吗？

我正在使用TypeScriptwith ，并且对将代码转换为代码Webpack有疑问。TypeScriptES5

target如果我理解正确的话，如果我将选项 (in tsconfig.json) 设置为ES5? ，我不需要任何 babel loader。正确的？

如果不是，那么差异在哪里？

我正在尝试对 Set 对象实现一些基本操作，如下所示

这是代码

export class Conjunto extends Set<any>{
  constructor(initialValues?) {
    super();
    return new Conjunto(initialValues);
  }

  isSuperset(subset) {
    //some code
  }
}

你们有什么想法让它发挥作用吗？或者我做错了什么？

目前我正在使用这个人在这里找到的黑客

将 ES6 JavaScript 添加到我的 Rails 项目后：

class SpinnerWindow {
  static show() {
    //...
  }

  static autoHideShow(timeout=1500) {
    //...
  }

  static hide() {
    //...
  }
}

部署到 Heroku 时它仍然包含已编译的 ES6（不是 ES5！）

...</div>  </div></div>';class SpinnerWindow{static show(){...

我已将所有需要的配置添加到.babelrc

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": "> 1%",
        "uglify": true
      },
      "useBuiltIns": true
    }]
  ],

  "plugins": [
    "syntax-dynamic-import",
    "transform-object-rest-spread",
    "transform-es2015-arrow-functions",
    "transform-es2015-block-scoped-functions",
    "transform-es2015-block-scoping",
    "transform-es2015-classes",
    "transform-es2015-computed-properties",
    "transform-es2015-destructuring",
    "transform-es2015-for-of",
    "transform-es2015-function-name",
    "transform-es2015-literals",
    "transform-es2015-modules-commonjs",
    "transform-es2015-object-super",
    "transform-es2015-parameters",
    "transform-es2015-shorthand-properties",
    "transform-es2015-spread",
    "transform-es2015-sticky-regex",
    "transform-es2015-template-literals",
    "transform-es2015-typeof-symbol",
    "transform-es2015-unicode-regex",
    "transform-regenerator",
    "transform-async-to-generator",
    ["transform-class-properties", …

我有一个没有定义类型的对象源，但代表一个类型对象。所以我正在使用 Object.assign(target, source)。但我的类具有 getter 属性（因为它们是其他属性的计算结果）。

一个例子：

source: {
  a: 1,
  b: 2,
  sum: 3
}

class SomeClass {
  a: number;
  b: number;

  get sum(): number {
    return a + b;
  }
}

someFunction() {
  let obj = new SomeClass();
  Object.assign(obj, source);
}

在上述情况下，我收到错误： Cannot set property sum of [object Object] which has only a getter。

有什么方法可以让 Object.assign() 忽略源对象中的这些属性吗？

webpack.config.js

const path = require('path')
HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'index_bundle.js',
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ["@babel/preset-env", "@babel/preset-react"],
            plugins: ["@babel/plugin-proposal-class-properties"]
          }
        }
      },
      {
        test:/\.css$/,
        use:['style-loader','css-loader']
      }
    ]
  },
  plugins: [
    new webpack.DefinePlugin({
      APIHOST: JSON.stringify('test'),
      BLOCKCHAINHOST: JSON.stringify('test')
    }),
    new HtmlWebpackPlugin({
      template: './src/template.html'
    }),
  ]
}

我定义了 2 个变量 APIHOST 和 BLOCKCHAINHOST，我尝试在 ReactJS App.js 中控制台记录它，如下所示

componentDidMount() {
    console.log(APIHOST)
}

我收到的错误是 …

我正在使用 create-react-app 的 TypeScript 风格：

npx create-react-app my-app --typescript

当我构建应用程序时，捆绑包仍然包含 ES5 后的代码，例如 Symbol。我缺少什么？我的 tsconfig 文件：

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react"
  },
  "include": [
    "src"
  ]
}

我在使用“dependOn”条目参数时无法让 Webpack 5 输出 es5 兼容代码。

我使用 Babel 来转译我的代码，效果很好，但除非我将 webpack 目标设置为“es5”，否则 webpack 本身会输出不兼容的代码。

我正在使用入口参数“dependOn”，它的行为与目标：“web”的预期一致，但是一旦我将其更改为“es5”，我就会收到“来自 Terser 的 main.build.js 中的错误”和“意外的令牌” : punc(:) [main.build.js:3,9]”。

删除“dependOn”参数允许其编译，但随后我将供应商库添加到每个条目中。

这是重现该问题的最小 webpack 配置（注释掉 target: "es5" 或 dependentOn: "vendor" 修复它）：

const path = require('path');

module.exports = {
    mode: "production",
    target: "es5",

    entry: {
        vendor: "./src/test.js",
        main: {
            dependOn: "vendor",
            import: ['./src/main.js']
        }
    },
    output: {
        filename: '[name].build.js',
        path: path.resolve(__dirname, 'dist')
    },

    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader'
                }
            }
        ]
    }
}; …

var a;
console.log('1 a: ' + a);
if (true) {
    a = 1;
    function a() { };
    a = 5;
    console.log('2 a: ' + a);
}
console.log('3 a: ' + a);

输出是：

1 a: undefined
2 a: 5
3 a: 1

我无法理解最后的输出“3 a: 1”。为什么不是“3 a：5”？