首页 > 编程语言 >[Typescript] DOMNodeExtractorConfig

[Typescript] DOMNodeExtractorConfig

时间:2023-02-10 20:57:58浏览次数:47  
标签:Typescript return type element Expect unknown const DOMNodeExtractorConfig

import { it } from 'vitest';
import { Equal, Expect } from '../helpers/type-utils';

export const isDivElement = (element: unknown): element is HTMLDivElement => {
  return element instanceof HTMLDivElement;
};

export const isBodyElement = (element: unknown): element is HTMLBodyElement => {
  return element instanceof HTMLBodyElement;
};

interface DOMNodeExtractorConfig<T, Result> {
  isNode: (node: unknown) => node is T;
  transform: (node: T) => Result;
}

const createDOMNodeExtractor = <T, TResult>(
  config: DOMNodeExtractorConfig<T, TResult>
) => {
  return (nodes: unknown[]): TResult[] => {
    return nodes.filter(config.isNode).map(config.transform);
  };
};

it('Should pick up that "extractDivs" is of type "HTMLDivElement[]"', () => {
  const extractDivs = createDOMNodeExtractor({
    isNode: isDivElement,
    transform: (div) => {
      type test1 = Expect<Equal<typeof div, HTMLDivElement>>;
      return div.innerText;
    },
  });

  const divs = extractDivs([document.createElement('div')]);

  type test2 = Expect<Equal<typeof divs, string[]>>;
});

it('Should pick up that "extractBodies" is of type "HTMLBodyElement[]"', () => {
  const extractBodies = createDOMNodeExtractor({
    isNode: isBodyElement,
    transform: (body) => {
      type test1 = Expect<Equal<typeof body, HTMLBodyElement>>;

      return body.bgColor;
    },
  });

  const bodies = extractBodies([document.createElement('body')]);

  type test2 = Expect<Equal<typeof bodies, string[]>>;
});

 

标签:Typescript,return,type,element,Expect,unknown,const,DOMNodeExtractorConfig
From: https://www.cnblogs.com/Answer1215/p/17110244.html

相关文章

  • [Typescript] Combine Branded type with type predicates
    import{it}from'vitest';import{Brand}from'../helpers/Brand';typeValid<T>=Brand<T,'Valid'>;interfacePasswordValues{password:string;co......
  • [Typescript] Using type predicates
     import{expect,it}from"vitest";import{Equal,Expect}from"../helpers/type-utils";exportconstvalues=["a","b",undefined,"c",undefined];c......
  • 从JavaScript到TypeScript,Flow与WebAssembly
    1、TypeScriptTypeScript是一种由微软开发的自由和开源的编程语言,它是JavaScript的一个超集,扩展了JavaScript的语法,主要提供了型别系统和对ES6的支持。TypeScript......
  • TypeScript入门
    TypeScript入门​一、什么是TypeScriptJavaScript的超集,可以编译成JavaScript。添加了类型系统的JavaScript,可以适用于任何规模的项目。TypeScript特性类型系统从......
  • [Typescript] Use Function Overloads to Avoid Returning undefined
    //You'llneedtousefunctionoverloadstofigurethisout!functionuseData<T>(params:{fetchData:()=>Promise<T>;initialData?:T}):{getData:()=>......
  • typescript基础用法
    一、特点TypeScript是添加了类型系统的JavaScript,适用于任何规模的项目。TypeScript是一门静态类型、弱类型的语言。TypeScript是完全兼容JavaScript的,它不会修......
  • [Typescript] Global Scope
    Definefunction/variableinglobalscopeglobalThis.myFunc=()=>true;//doesn'tcompileglobalThis.myVar=1;//doesn'tcompileit("Shouldletyoucall......
  • [Typescript] Indexing an Object with Branded Types
    Inthisexercise,we'regoingtolookatareallyinterestingpropertyofbrandedtypeswhenthey'reusedwithindexsignatures.Herewehaveour User and P......
  • [Typescript] Defining exclusive properties with TypeScript
    typeA={other:'string',url:'string'}typeB={other:'string',ids:'string'}typeExclusive<TextendsRecord<PropertyKey,unknown>,UextendsReco......
  • TypeScript笔记 - 函数
    注解函数函数需要注解的部分其实只有参数值和返回值letcheckFunc=(str:string):boolean=>{returnstr['includes']('a')}checkFunc('abc') 使用接口......