TYPESCRIPT - 技术教程文章
[TypeScript] 建置输出单一JavaScript档案(.js)与Declaration档案(.d.ts)【代码】
[TypeScript] 建置输出单一JavaScript档案(.js)与Declaration档案(.d.ts)问题情景开发人员使用Visual Studio来开发TypeScript，可以很方便快速的将项目里的所有TypeScript档案(.ts)，一口气全部编译成为JavaScript档案(.js)，用以提供html网页使用。但是当软件项目越来越庞大的时候，过多的.js档引用，会增加开发.html档案时的负担;并且每个.js档之间的相依关系，也很容易因为引用顺序的错误，而造成不可预期的问题。<!DOCTYPE htm...
Typescript高级用法 keyof，Pick，Record，Partial，Required，Exclude，Omit？【代码】
记录一下typescript中一些类型高级用法：首先声明一个类型IUser：interface IUser {name: string;age?: number;class?: string;sex: string; }1、keyof：作用是获取键type keys = keyof IUser;2、Pick：从类型定义的属性中，选取指定一组属性，返回一个新的类型定义。源码：type Pick<T, K extends keyof T> = {[P in K]: T[P]};例子：type IPG = Pick<IUser, ‘name‘> let gg: IPG = {name: ‘5‘ }3、Record：以 typeof 格式快速...
typescript中高级类型之交叉类型与联合类型【代码】
交叉类型交叉类型的表示方法为 Type1 & Type2，结果是取这两个类型的并集。这里是官网的例子，做了注释：// 定义函数 extend，用来合并对象function extend<T, U>(first: T, second: U): T & U {// result 是要返回结果，类型断言为 T & Ulet result = {} as T & U// 遍历 first，结果存入 resultfor(let id in first){// 不能将类型“T”分配给类型“T & U”，所以需使用断言result[id] = first[id] as any}// 遍历 second，结果存...
TypeScript数据结构与算法（2）最基础的数据结构-栈【代码】
栈是一种先入后出的数据结构，最先进入的元素，却是最后出来，开发中，是否需要用到栈，只要记住它的这条特性就好了，这里我使用之前实现的DataStruct_Array类作为栈的底层容器实现，我们都知道对于栈来说，它需要提供给用户以下接口：1.getSize()：获取栈的实际数目2.isEmpty()：判断是否为空栈3.getCapacity()：获取栈的容量4.push()：入栈操作5.pop()：出栈操作（出栈顶元素）6.peek()：查看栈顶是哪位大神在实现Stack类之前，需...
TypeScript 之 书写.d.ts文件
https://m.runoob.com/manual/gitbook/TypeScript/_book/doc/handbook/Writing%20Definition%20Files.html类的分解 TypeScript的类会创建出两个类型：实例类型，定义了类的实例具有哪些成员；构造函数类型，定义了类的构造函数具有哪些类型。 构造函数类型也被称做类的静态部分，因为它包含了类的静态成员。原文：https://www.cnblogs.com/cag2050/p/9553100.html
typeScript函数篇【代码】
typeScript的函数是在es6的函数特性的基础上加了一些后端的概念：泛型、参数类型声明、返回值类型声明、重载、装饰器等。其他的一些特性：箭头函数、生成器、async-await、promise等都是es6的加的特性。函数类型JavaScript的函数参数是可以任何类型的，typeScript中加了对参数提添加类型，函数本身添加返回值类型。function greetNane(name: string): string {return `hello ${name}` }还有一种函数声明的方式：let greetNane: (na...
typescript 入门教程一【代码】
从今天开始，持续更新typescript入门教程系列....目前ts越来越火，主流的前端框架，好比angular，vue 3均是采用ts来编写，所有很多公司的项目都是用ts来写的，所有是时候认真学习ts了 ts来源于微软公司，越是大的公司，越是大的项目，越是推荐使用ts来编码，ts是js的超集，在js上面增加一些内容，相对于js，ts具有以下的优点：支持面向对象方法，之前js实现面向对象是通过prototype，function实现的，有点繁琐。ts提供了Class，Int...
萌新前端TypeScript之旅--安装TypeScript【代码】
安装TypeScript 1.打开 TypeScript官方文档 看到需要用到node.js管理工具npm进行下载 什么东东？ 2.Node.js 安装包及源码下载地址：https://nodejs.org/en/download/ 安装完node.js 会自带npm可以直接使用 3.配置npm使用国内镜像npm config set registry https://registry.npm.taobao.org 4.安装TypeScriptnpm install -g typescript 5.安装完成后查看是否安装成功，常用为查看版本号 运行$ tsc -v 报错，报错信...
typescript【代码】
一、介绍1.typescript是由微软开发的一款开源的编程语言2.ts是js的超级，拓展了js语法，更像java/c#这样面向对象语言，更适合开发大型项目。3.谷歌也在大力支持ts,谷歌的angular2x+ 就是基于ts语法的。4.最新的Vue ,React 也可以集成ts。二、安装和编译1.安装：npm install -g typescript2.生成配置文件：tsc --init 创建tsconfig.json 文件（eg:可修改输出地址“outDir”：“./js”,等配置）3.编译：tsc hello.ts (hello.ts 是自...
javascript – 如何在TypeScript中将类方法作为jQuery EventHandler附加【代码】
我正在将一些JavaScript代码转换为TypeScript,我无法弄清楚jQuery EventHandler的签名应该如何. 这是我在JavaScript中所拥有的,但简化为更通用的术语(我使用通过元素分发的自定义事件的某种pub-sub或observable模式)：Observer.prototype._subscribe = function() {this._row.bind('onItemChanged', this, this._onChangedHandler); }; Observer.prototype._onChangedHandler= function(event, someString, someObject) {var that ...
Typescript开发node.js项目实例详解【图】
本文主要介绍了详解使用Typescript开发node.js项目（简单的环境配置），非常具有实用价值，需要的朋友可以参考下，希望能帮助到大家。最近在学习typescript的过程中，想到也许可以使用ts来开发node.js项目。在网上搜了一下，其实已经有很多开发者实践了这方面的内容。这里，我记录一下自己搭建开发环境的简单过程。使用Typescript开发的好处:较严格的类型检查和语法检查。对ES6/ES2015/ES7(部分)支持比较好。编译后的js文件很干净，...
TypeScript——基础——原始数据类型【代码】
前言：JavaScript原始数据类型主要分为布尔值、数值、字符串、nul、undefined和ES6中的新类型Symbol和BigInt TypeScript中原始数据类型的应用 一、布尔值（boolean）let isDone : boolean = false ;二、数值（number）let decLiteral: number = 6; let hexLiteral: number = 0xf00d; let binaryLiteral: number = 0b1010;//ES6 中的二进制表示法 let octalLiteral: number = 0o744;//ES6 中的八进制表示法 let notANumber: number ...
如果对c#很熟悉，一定要再学一门叫typescript的语言
他们之间简直太像了。 虽然，有一些特殊的语法，让人发懵。 但是，正如日语和中文放在一起，能看到太多熟悉的共同点。 typescript和c# 至少有80%相通的概念。 如果，你是一个c#码农， 打算补补前台开发的技术栈的话。 先学一周js，再花一周时间学typescript，就差不多能开始写代码了。
TypeScript 的IndexedDB 帮助类 笔记
DataPak {public CodeID: number = 1;public Data: any;public Message: string = ‘‘;public Description: string = ‘成功‘;constructor(Data: any = null, CodeID: number = 1, Description: string = ‘成功‘, Msg: string = ‘‘) {this.CodeID = CodeID;this.Data = Data;this.Message = Msg;this.Description = Description;}; };class DB_Instance {private DB_Cache: string = ‘DB_Cache‘;private DB_VERSION: numbe...
基于 TypeScript 的 Weex 优化实践【图】
有赞技术 有赞coder 作者：周佳敏部门：有赞零售-移动组一、背景Weex 作为一种成熟的跨平台程序框架被运用到许多产品中，有赞也不例外。有赞零售移动端团队从 2018 年就开始使用 Weex 构建页面，据不完全统计，有赞零售移动端有超过300个页面使用到了 Weex 开发！显然，这是一个巨大的开发工程，同时我们也发现基于 JavaScript 的 Weex 开发给我们带来了诸多痛点：缺少类型约束，编程时代码提示全凭记忆，要拓展新功能也束手束脚。...
javascript – 类似于Revealing Module Pattern结构的TypeScript代码【代码】
我想将我编写的一些JavaScript代码转换为TypeScript.作为一名JavaScript开发人员,我对TypeScript语法和思维方式都很陌生. 令我头疼的是我很难将使用Revealing Module Pattern的一些代码转换成TypeScript. 一个例子如下：//JS Code var obj;//code... (function(){function myFunction(){//do work}function MyOtherConstructor(){return {publicMethod: myFunction}}obj = new MyOtherConstructor(); })();//use obj.publicMethod ...
为什么要在Javascript / Typescript上进行多种导入/导出【代码】
我是服务器端javascript的新手,以前我曾将nodejs用于简单的事情,但仅使用默认库(在此我永远不需要使用require或import关键字),但是最近我正在学习ReactNative/ReactXP我已经看到：import RX = require('reactxp'); const popsicle = require('popsicle'); import LoginPage = require("./LoginPage"); import React, { Component } from 'react'; import { AppRegistry, Text } from 'react-native'; import AppState from './AppS...
javascript – 如何在TypeScript中新建一个类【代码】
我是TypeScript的新手,但在C#方面经验丰富.我正在尝试做一些非常简单的事情,而且我缺少一些基本的东西.我正在使用Protractor在Angular前端编写用户测试.我正在使用页面对象模式,我想将页面对象保存在与用户测试不同的文件中,这样我就可以在多个用户测试文件中共享页面对象. 我一直收到一个错误,说当我尝试新建这个类时,页面对象类不是一个函数.我究竟做错了什么？这是我的代码失败的错误： TypeError：UserTests.DashboardPage不是...
javascript – 在同一个项目中同时使用coffeescript和typescript【代码】
我实际上试图在同一个项目中使用coffeescript和typescript. 事实上,我希望能够在编码时选择我喜欢哪一个. 事实是,由于使用coffeescript生成的javascript,typescript生成的javascript似乎没有按预期工作 说明： 我用coffeescript编写了一个Controller类,当我在coffeescript文件中扩展它时,它运行得很好：Controller = require('../node_modules/Controller/Controller')class HelloController extends ControllerindexAction: (name...
Javascript大师说服我,我应该使用javascript编译为ds语言,如Dart或Typescript
您好我即将开始开发大型前端应用程序,我正在研究什么是客户端生态系统的最佳选择.我是一个有Java背景的人,做了一段时间的Spring应用程序,在我的私人项目中,大部分逻辑部分都驻留在浏览器中.这是一个基于Web的图像处理和图表应用程序,需要大量的图形处理,高级用户交互,如拖放,我希望代码库足够大.我处理过写得不好的大型js代码库.这对我很头疼.然后我的javascript声名狼借.最初我在查看Google Web工具包.但我发现它不适合我的应用程...
javascript-在Typescript中使用Object.keys时避免隐式“ any”类型【代码】
我有一个带有已键入键的对象,并且我想遍历它并保持其类型,避免“元素隐式具有“任何”类型,因为“ ContactList”没有索引签名”. 我知道在Typescript的GitHub页面上对此进行了详尽的讨论,但是我在这里找不到任何解决方案.尝试用枚举和联合,但我仍然收到错误. 枚举(playground)的示例enum Names {Joe,Bill,Bob }type ContactList = {[key in Names]: {isFriend: boolean;} }const contactList: ContactList = {[Names.Joe]: {isFrie...
javascript – Typescript transpiler：套管问题
我有一个曾经被称为Group.ts的打字稿文件.当转换为javascript时,生成的文件将被称为Group.js. 我现在已将typescript文件重命名为group.ts(小写g).但是,生成的javascript文件仍称为Group.js(大写g).甚至在删除Group.js和Group.js.map文件之后. 我已经尝试将typescript文件重命名为somegroup.ts,然后将转换后的文件称为somegroup.js(正确的大小写).然后我将文件重命名为group.ts,生成的javascript文件再次被称为Group.js(错误的大小写...
c# – typescript编译器可以生成POCO .NET类型/程序集吗？
我正在使用MVC和EF的淘汰赛进入应用程序开发,我正在研究如何在配方中添加TypeScript可能会帮助我. 我喜欢在IDE中创作的更清晰的机制,但缺少的东西似乎是能够从其他.NET程序集引用typescript中定义的接口. 我是对的,除了尚未完成之外没有什么可以阻止这种情况发生吗？我很好奇是否需要它,或者我是否以其他人不是的方式查看问题域. 我看到实用程序的原因是因为目前我无法在一个地方定义给定的DTO.我必须在我的C#View模型和javascript...
javascript-如何在typescript中将jQuery ui与commonjs一起使用【代码】
为了获得更多的上下文,我决定将我的所有模块都保持为commonjs格式,以实现可移植性,并使用browserify和其他一些东西来捆绑前端的东西. 我使用TypeScript进行类型检查,但不确定如何在配置中使用jquery ui.参见下面的简单示例. 的package.json{"main": "Main.js","license": "MIT","dependencies": {"@types/jquery": "^2.0.34","@types/jqueryui": "^1.11.31"} }tsconfig.json{"compilerOptions": {"module": "commonjs","baseUrl": ...
javascript – 如何在index.d.ts typescript定义文件中引用Redux类型？【代码】
我想创建一个index.d.ts文件,该文件引用了一些名为redux的流行NPM包中的某些类型. 我已经尝试过的事情： (在我的index.d.ts文件的顶部) > ///< reference path =“../../../ node_modules / redux / index.d.ts”/> 这不起作用.我怀疑这是因为redux / index.d.ts文件根本没有声明命名空间.当我编辑redux / index.d.ts文件并用声明命名空间Redux {…}包装所有内容时,一切正常.我在redux@^4.0.0. > ///< reference types =“redux”/...
javascript – 使用原始jsdoc注释生成Typescript .d.ts文件？【代码】
背景：打字稿1.5 betaWebstorm 10 我目前正在TS中开发两个独立的项目,一个库和一个将使用该库的项目. 当我在库项目中编码时,Webstorm完全理解写入的jsdoc,并且CTRL Q正确显示它. 然后我编译库(一个单独的大输出文件),沿途生成.d.ts文件,并尝试在另一个项目中使用它：当我调用CTRL Q时,没有更多文档可用. 经过调查,我发现JSDOC仍然存在于生成的javascript中,但它不在.d.ts文件中 – 所以Webstorm认为没有. 所以我的问题是：如何在.d...
javascript – 我可以在TypeScript中将参数类型指定为多种类型之一而不是任何类型吗？【代码】
在TypeScript中的方法声明中,参数可以是字符串,布尔值或数字的类型.我是否必须将其声明为任何[],或者是否有办法将输入类型限制为这三种类型？解决方法:打字稿1.4引入了Union Types所以答案现在是肯定的,你可以.function myFunc(param: string[] | boolean[] | number[]): void;使用除指定类型之外的其他类型将触发编译时错误. 如果您需要多个特定类型的数组,您也可以使用联合类型：function myFunc(param: (string|boolean|number)...
javascript-是否允许TypeScript中的另一个字段初始化字段？【代码】
我正在尝试在TypeScript类中执行此操作：private _errorHappened = new Subject<SomeError>(); public errorHappened = this._errorHappened.asObservable();我在另一个字段的内联初始化期间使用字段的值.提供的示例有效,如果我翻转这两行的顺序,则会抛出无法读取未定义错误的属性“ asObservable”.这使我认为解析器自上而下地处理类声明,并且如果您引用上面已经定义的字段,那么一切都很好. 我的问题是：这种行为可以信任吗？我的...
在Typescript中,您如何区分Node和vanilla Javascript错误类型？【代码】
我有以下功能：/*** Retrieves a component template from filesystem*/ const getComponentTemplate = async (p: string ): Promise<string> => {let template: stringtry {template = await fs.readFile(p, {encoding: 'utf8'})} catch (e) {if (e instanceof Error && e.code === 'ENOENT') {throw new Error(`template for element type ${elementType} not found`)}throw e}return template }打字稿在这里抱怨： [ts]“错误”...
教你30秒发布一个TypeScript包到NPM的方法步骤
文章读译自The 30 second guide to publishing a typescript package to npm，部分内容有修改哈。 这篇文章要求你有一定的 JS 、TS 和 NPM 的知识，如果你写过普通的 NPM 包就更好啦~如果没有的话网上也很多教程的，都很简单~ 发布过 npm 包的同学都知道，初始化一个 npm 项目，直接用 npm init -y 就可以了，那如果要用 ts 呢，直接 tsc --init 即可。这两个操作会生成 package.json 和 tsconfig.json 文件。然后我们按以下步骤修...