使用命名参数JavaScript(基于打字稿)

Question

我有问题,当在TypeScript中使用命名参数时,我知道它不支持我在TS中使用它的方式.但我怎么能

打字稿:

SomeFunction(name1: boolean, name2: boolean, name3: boolean, name4: boolean) //will occur only 1 time, so the change should be in typescript

JavaScript的:

$(function () {
     ...SomeFunction({name1:false, name2:false, name3:false, name4:true}); //will occur 100 times    
});

我在看(这没有用):

在javascript中命名参数

如何将可选的命名参数添加到TypeScript函数参数中？

我可以在TypeScript中做什么,在JavaScript中使用命名参数？

我想知道的是,当我在TypeScript中使用它时,VS2015在使用命名参数时没有显示语法错误...

ps.:我使用TS 2.1

Answer 1

您可以使用命名参数:

interface Names {
    name1: boolean
    name2: boolean
    name3: boolean
    name4: boolean
}

function myFunction({name1, name2, name3, name4}: Names) {
    // name1, etc. are boolean
}

注意:该类型Names实际上是可选的.以下JavaScript代码(无需键入)在TS中有效:

function myFunction({name1, name2, name3, name4}) {
    // name1, etc. are of type any
}

精度:实际上,此功能是用于模拟命名参数的解构.在JavaScript和TypeScript中不存在真正的命名参数.

Answer 2

匿名接口

我只是想指出，您还可以在参数列表中声明没有名称的类型，如下所示，这使我们无需键入interface myfuncArgs.

它仍然迫使我重新输入每个参数，这很痛苦，但我现在不知道如何避免这种情况。

const assert = require('assert')

function myfunc({
    myInt,
    myString,
  }: {
    myInt: number,
    myString?: string,
  }
) {
  return `${myInt} ${myString}`
}

assert.strictEqual(
  myfunc({
    myInt: 1,
    myString: 'abc',
  }),
  '1 abc'
)

assert.strictEqual(
  myfunc({
    myInt: 1,
  }),
  '1 undefined'
)

// Fails as desired since myInt is not optional and was not given.
//assert.strictEqual(
//  myfunc({
//    myString: 'abc',
//  }),
//  'unefined abc'
//)

// Fails as desired since wrong type of myInt.
//assert.strictEqual(
//  myfunc({
//    myInt: '1',
//    myString: 'abc',
//  }),
//  '1 abc'
//)

编译并运行：

npx tsc main.ts
node main.js

测试于：

  "dependencies": {
    "@types/node": "^16.11.13",
    "typescript": "^4.5.4"
  }

有关的：

• 在 Typescript 中解构函数参数

• https://github.com/Microsoft/TypeScript/issues/29526功能请求允许语法：

  function myfunc({
    myInt: Number,
    myString?: String,
  })
  

interface当有可选参数时，您通常需要显式

如果任何 props 是可选的，如下例所示，并且可能是大多数“选项”参数，那么您可能需要显式定义类型，如下所示： https: //stackoverflow.com/a/42108988/ 895245因为调用者迟早可能会需要它来逐步构建选项对象，相关：How do Idynamically allocate properties to an object in TypeScript?

例如，考虑以下工作代码：

const assert = require('assert')

interface myfuncOpts {
  myInt: number,
  myString?: string,
}

function myfunc({
  myInt,
  myString,
}: myfuncOpts) {
  return `${myInt} ${myString}`
}

const opts: myfuncOpts = { myInt: 1 }
if (process.argv.length > 2) {
  opts.myString = 'abc'
}

assert.strictEqual(
  myfunc(opts),
  '1 abc'
)

如果我们定义了myfuncOpts内联，那么我们将无法执行const opts: myfuncOpts, 然后opts.myString = 'abc'会失败，因为：

const opts = { myInt: 1 }
if (process.argv.length > 2) {
  opts.myString = 'abc'
}

的类型opts是从初始化中推导出来的，其中不包含myString.

我希望 TypeScript 能够实现一个系统，您可以在其中说“使用此类函数的此类参数的类型”。然后我们可以使用内联参数类型定义，但仍然以某种方式引用该类型，这将是涅槃。

Answer 3

接近“命名参数”的唯一方法是使用单个对象参数：

type SomeFunctionParams = {
    name1: boolean;
    name2: boolean;
    name3: boolean;
    name4: boolean;
}

SomeFunction(params: SomeFunctionParams) { ... }

然后：

$(function () {
    SomeFunction({
        name1:false, 
        name2:false, 
        name3:false, 
        name4:true
    });  
});