I recently created a function to duplicate an array:
const data = (items) => {
myData = items.slice()
}
The variable items is an array of objects with varying shapes. How can I accomplish this in TypeScript?
const data = (items: Array<any>) => {
This method works, but I'm uncertain if using 'any' is the most appropriate approach.
To accomplish this, you can utilize the power of generics. Generics allow for inferring the input type dynamically.
In this example below, I am showcasing how to return a copy to demonstrate what is inferred for the output based on the given T.
// By using T extends unknown[], we are restricting the parameters to be of array type
const data = <T extends unknown[]>(items: T): T => {
myData = items.slice()
return myData;
}
// Inferred as number[]
const outputA = data([1, 2, 3])
// Inferred as string[]
cont outputB = data(['str1', 'str2'])
Without providing details on what myData represents and how it should be used, it's difficult to offer a precise solution. Assuming you intend for the function to return a copied array, one approach could be to introduce a generic type for data, allowing the returned array's type to be inferred based on the input parameter.
const data = <T,>(items: T[]): T[] => {
return items.slice()
}
const newArray = data([3,4,5])
// const newArray: number[]
I find the other responses to be quite helpful, but I have reservations about their ability to handle deep copies for more intricate objects. In contrast, the following function accomplishes this task:
const a = (items: any[]): any[] => {
const copyArray: any[] = []
items.forEach((i) => copyArray.push({...i}));
return copyArray;
}
Alternatively, you could use:
const a = (items: any[]): any[] => {
const copyArray: any[] = []
items.forEach((i) => copyArray.push(Object.assign({}, i)));
return copyArray;
}
However, please note that this method is not ideal for list strings as it may split them into arrays.
Can methods be utilized on QueryList within the HTML template? For example, in the TypeScript file I can use: @ContentChildren(DonneeEntiteDirective) content!: QueryList<DonneeEntiteDirective> let test = this.content.find(e => e.name === 'su ...
After running npm install @types/node, the TypeScript compiler worked perfectly with tsc -p tsconfig.json. However, when I attempted to install the package globally with npm install -g @types/node and deleted the local folder, I encountered the following ...
The structure I am currently working with is as follows; import data from "../data.min.json"; export enum TileType { tree = 'tree', rock = 'rock' } interface MapTile { walkable: boolean; positions: number[][]; } exp ...
I'm looking to keep all my code in AngularJS 1.x while also preparing it for an easy upgrade to AngularJS 2 in the future. To align my code with Angular 2 standards, I am interested in using TypeScript and SystemJS in version 1.5.x initially. Is ther ...
Currently, I am developing a Web app to manage light control through the openHab API and utilizing SSE. However, an issue arises when the light is turned on as I receive three messages simultaneously. One message contains the value 100, while the other tw ...
I am currently working on encrypting a password using the built-in crypto module. Previously, I used createCipher which is now deprecated. I am wondering if there is still an effective way to achieve this. Here is the old code snippet: hashPassword(pass: ...
Currently, I'm studying the Angular 5 HTTP tutorial. Everything was going smoothly until I encountered a strange issue in my Ionic project where it started throwing an error stating that "of is not defined". /** * Handle Http operation that failed. * ...
I am struggling to extract the ImgString from an array retrieved from an API and assign it to the base64 property of a photo object, but I keep encountering an error. As someone new to react, typescript, and javascript, I'm unsure where my code is goi ...
One of the components in this application is registerClass, where all routes are added. The source code is in the dist directory since this node app is using TypeScript. However, when calling the http://localhost:9001/user endpoint, it seems that it is not ...
Looking to retrieve data from the API, specifically using PHP on the backend. While I can access the data successfully, I'm running into an issue with *ngFor and the search bar functionality. The search button only appears when the input in the search ...
With the goal of learning Apollo Server, I decided to implement the schema outlined here. The CodeGen produced what seemed to be logical type definitions for books and libraries. export type Book = { __typename?: 'Book'; author: Author; tit ...
I am attempting to establish a GET method for my PHP API. Here is the code snippet I am using: export class PerfilComponent { perfil: any; constructor(private http: HttpClient) { } ngOnInit() { const token:string | null = localStorage.getItem(&ap ...
I am trying to locate words that begin with $. var str = "$hello, this is a $test $john #doe"; var re = /(?:^|\W)\$(\w+)(?!\w)/g, match, results = []; while (match = re.exec(str)) { results.push(match[1]); } The regular expression a ...
After successfully loading the Google Maps JavaScript API in the public/index.html, I can log window.google.maps without any issues in the dev tools console. https://i.sstatic.net/XqeG5.png However, TypeScript seems unaware of its presence, resulting in ...
I encountered an unexpected issue with the code below: Type '{ children: Element; appId: string | undefined; serverUrl: string | undefined; }' is not compatible with type 'IntrinsicAttributes & MoralisProviderProps'. The property ...
Currently, I am working on developing a navigation menu using angularJS2. Here is the snippet from my app.component.ts: import {provide, Component} from 'angular2/core'; import {APP_BASE_HREF, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, HashLocati ...
Currently, I'm in the process of testing my Node TypeScript application with Jest. My goal is to avoid altering my existing class, which looks something like this: export class UserRepository { async createUser(userData: User) { const pris ...
Hey there! I have a typescript code snippet that looks like this: import { getConnection } from "typeorm"; import { GraphQLClient } from "graphql-request"; import got from "got"; import database from "./utils/database&quo ...
I am dealing with a tree structure that has Node objects: class Node implements ITreeNode { id?: any; name: string; children:? Node[], enabledState = new Subject<boolean>(); toggle() { this.enabled = !this.enabled; this.enabledStat ...
It's common knowledge that Promise.all will return settled promises in the same order of the requested iterable. I'm currently grappling with how to correctly define types for individual settled resolves. I am utilizing Axios for handling asynch ...