TypeScript 学习笔记(一)
码文不易,转载请带上本文链接,感谢~ https://www.cnblogs.com/echoyya/p/14542005.html
目录码文不易,转载请带上本文链接,感谢~ https://www.cnblogs.com/echoyya/p/14542005.htmlTypeScript 介绍什么是TypeScript?JavaScript 的缺点为什么使用 TypeScript?安装TypeScript 的特性类型系统TypeScript 是静态类型TypeSc ...
TypeScript学习笔记(一)—— TypeScript入门
一、TypeScript概要
TypeScript是一种由微软开发的自由和开源的编程语言,它是JavaScript的一个超集,扩展了JavaScript的语法,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。安德斯·海尔斯伯格,C#的首席架构师,工作于TypeScript的开发。
官网:http://www.typescriptlang.org/
github:https://gi ...
TypeScript学习笔记(二)—— TypeScript基础
一、原始数据类型基本使用
TypeScript中拥有更多的类型,如下表所示:
类型例子描述
number
1, -33, 2.5
任意数字
string
'hi', "hi", hi
任意字符串
boolean
true、false
布尔值true或false
字面量
其本身
限制变量的值就是该字面量的值
any
*
任意类型
unknown
*
类型安全的any
void
空值(undefin ...
使用@babel/preset-typescript取代awesome-typescript-loader和ts-loader
前言
之前写过一篇旧React项目安装并使用TypeScript的文章:在React旧项目中安装并使用TypeScript的实践。
博客里使用awesome-typescript-loader对Typescript代码进行检测和转换。
而这几天又修改了一下自己的脚手架,使用@babel/preset-typescript来处理Typescript。
回顾awesome-typescript-loader方案
谈@babel/preset-t ...
在React旧项目中安装并使用TypeScript的实践
前言
本篇文章默认您大概了解什么是TypeScript,主要讲解如何在React旧项目中安装并使用TypeScript。
写这个的目的主要是网上关于TypeScript这块的讲解虽然很多,但都是一些语法概念或者简单例子,真正改造一个React旧项目使用TypeScript的文章很少。
所以在这里记录下改造一个React项目的实践。
博客内容部分参照 TypeScri ...
.NET手撸绘制TypeScript类图——下篇
.NET手撸绘制TypeScript类图——下篇
在上篇的文章中,我们介绍了如何使用.NET解析TypeScript,这篇将介绍如何使用代码将类图渲染出来。
注:以防有人错过了,上篇链接如下:https://www.cnblogs.com/sdflysha/p/20191113-ts-uml-with-dotnet-1.html
类型定义渲染
不出意外,我们继续使用FlysEngine。虽然文字排版没做过, ...
TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
\3c span id="mce_marker" data-mce-type="bookmark">\3c /span>\3c span id="__caret">_\3c /span>\3c !--
#div_digg { float: right; font-size: 12px; margin: 10px; text-align: center; width: 120px; position: fixed; right: 0; bottom: 0; z-index: 10; background-color: rgba(255, 255, 255, 1); padding: 10px; ...
TypeScript学习笔记(四)—— TypeScript提高
一、类型type
1.1、定义
Type又叫类型别名(type alias),作用是给一个类型起一个新名字,不仅支持interface定义的对象结构,还支持基本类型、联合类型、交叉类型、元组等任何你需要手写的类型。
type Num = number; // 基本类型
type StringOrNum = string | number; // 联合类型
type Person = {name: string}; // 对象 ...
十分钟教你理解TypeScript中的泛型
转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。原文出处:https://blog.bitsrc.io/understanding-generics-in-typescript-1c041dc37569
你将在本文中学到什么
本文介绍TypeScript中泛型(Generics)的概念和用法,它为什么重要,及其使用场景。我们会以一些清晰的例 ...
初次在Vue项目使用TypeScript,需要做什么
前言
总所周知,Vue新版本3.0 使用 TypeScript 开发,让本来就很火的 TypeScript 受到更多人的关注。虽然 TypeScript 在近几年才火,但其实它诞生于2012年10月,正式版本发布于2013年6月,是由微软编写的自由和开源的编程语言。TypeScript 是 JavaScript 的一个超集,扩展了 JavaScript 的语法,添加了可选的静态类型和基于 ...
Electron结合React和TypeScript进行开发
目录结合React+TypeScript进行Electron开发1. electron基本简介为什么选择electron?2. 快速上手2.1 安装React(template为ts)2.2 快速配置React2.3 安装electron2.4 配置main.js、preload.js和package.json文件2.5 运行electron项目2.6 打包项目3. 自动刷新页面4. 主进程和渲染进程5.定义原生菜单、顶部菜单5.1 自定义菜单5 ...
从零搭建Vue3 + Typescript + Pinia + Vite + Tailwind CSS + Element Plus开发脚手架
项目代码以上传至码云,项目地址:https://gitee.com/breezefaith/vue-ts-scaffold
目录前言脚手架技术栈简介vue3TypeScriptPiniaTailwind CSSElement Plusvite详细步骤Node.js安装创建以 typescript 开发的vue3工程集成Pinia安装pinia修改main.ts创建一个store在组件中使用store集成Tailwind CSS安装postcss、sass、auto ...
17、vue-cli3 js项目中引入ts混用(typeScript)
说明:
vue3.0搭建的项目,不过没有引入ts,后来需要用到一个插件是用ts写的,所以vue要用到ts。。。
一、安装typescript及loader
npm install typescript ts-loader --save-dev
二、安装vue-property-decorator
npm install vue-property-decorator --save-dev
三、配置vue.config.js
module.exports = {
configu ...
electron教程(番外篇二): 使用TypeScript版本的electron, VSCode调试TypeScript, TS版本的ESLint
我的electron教程系列
electron教程(一): electron的安装和项目的创建
electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google JavaScript Style Guide代码规范
electron教程(番外篇二): 使用TypeScript版本的electron, VSCode调试TypeScript, TS版本的ESLint
electron教程(二): http服务器, ws服务器, 子进 ...
【区分】Typescript 中 interface 和 type
在接触 ts 相关代码的过程中,总能看到 interface 和 type 的身影。只记得,曾经遇到 type 时不懂查阅过,记得他们很像,相同的功能用哪一个都可以实现。但最近总看到他们,就想深入的了解一下他们。
interface:接口
TypeScript 的核心原则之一是对值所具有的结构进行类型检查。 而接口的作用就是为这些类型命名和为你的 ...
typescript中使用Object.keys
开发中使用typescript的时候,经常会遇到使用 Object.keys 这个方法报错的情况,报错如下:
错误场景1
var foo = {
a: '1',
b: '2'
}
var getPropertyValue = Object.keys(foo).map(item => foo[item]) // 这里会有typescript的错误提示
错误场景2
var foo = {
a: '1',
b: '2'
}
function ...
typescript中类型断言理解
typescript很强大,但是用不好时也会很头痛,开发遇到类型错误的情况不在少数,或许你需要了解类型断言。使用断言,简单来说就是先做好一个假设,使得编译通过。
我一开始接触类型断言时是有点不明白的,后来我了解到原因是 “类型断言更像是类型的选择,而不是类型转换”。我发现不少博客文章里把类型断言说成了类型转换, ...
vue3+TypeScript+vue-router使用
简单使用
创建项目
vue-cli创建
$npm install -g @vue/cli
$vue --version
@vue/cli 4.5.15
$vue create my-project
然后的步骤:
Please pick a preset
选择 Manually select features
Check the features needed for your project
选择上TypeScript,特别注意点空格是选择,点回车是下一步
Choose a version of Vue.js t ...
TypeScript是什么,为什么要使用它?
转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。
原文出处:https://medium.com/swlh/what-is-typescript-bf333e23f259
从历史上看,JavaScript已经成为了在Internet上编写网页和应用程序脚本语言的主要语言。但是否能通过JavaScript创建大型复杂Web应用系统呢?可 ...
TypeScript 学习笔记 — 类型断言(二)
目录类型断言语法类型断言的用途联合类型可以被断言为其中一个类型父类可以被断言为子类任何类型都可以被断言为 anyany 可以被断言为任何类型非空断言双重断言字面量类型 + 联合类型类型断言的限制类型断言 vs 类型转换上一篇:TypeScript 入门自学笔记(一)
类型断言
类型断言(Type Assertion): 主要用于当 TypeScript ...