Bertil的博客

目录1.项目搭建2.项目界面3.定义Food类4.定义ScorePanel类5.定义Snake类6.定义GameControl类7.项目入口文件index.ts1.项目搭建准备好之前的webpack.config.js、tsconfig.json、package.json、package-lock.json四个文件，然后执行npm i安装依赖安装其他依赖：npm i -D less less-loader css-loader style-loader（四个包，因为要使用到less）如果有其他web

目录1.面向对象2.类（class）3.构造函数和this4.继承5.super6.抽象类（ts新增的）7.接口（ts新增的）8.属性的封装9.泛型（ts新增的）1.面向对象面向对象是程序中一个非常重要的思想，简而言之就是程序之中所有的操作都需要通过对象来完成。对象中有属性和方法。举例操作浏览器要使用window对象操作网页要使用document对象操作控制台要使用console对象2.类（class）使用class关键字来定义一个类class Person{ /*

1.webpack的简单使用一般项目中我们不会直接编译ts代码，而是使用打包工具来进行。初始化项目：npm init -y安装依赖：cnpm i -D webpack webpack-cli typescript ts-loader（四个包）webpack-cli—命令行工具ts-loader—将ts代码和webpack能整合在一起新建webpack.config.js文件// 引入一个包const path = require('path');//webpack 中

1.自动编译的两种方法tsc ts文件 -w 能够对单个ts文件进行监视，若有修改则会自动重新编译。新建一个tsconfig.json文件，然后在命令行执行tsc -w 可以对所有ts文件进行监视，若有修改则会自动重新编译。2.tsconfig.json文件tsconfig.json 是ts编译器的配置文件，ts编译器可以根据它的信息来对代码进行编译include用来表示需要被编译的ts文件目录路径: **表示任意目录, *表示任意文件"include": ["./sr

1.类型声明直接在变量声明后面加let a: number;a = 10;a = 'hello'; // 此行代码会报错，但是可以编译成js（也可以设置为报错不能编译成功）如果变量的声明和赋值是同时进行的，TS可以自动对变量进行类型检测let c = true;c = false;还可以对函数参数和返回值的类型进行声明function sum(a: number, b: number): number{ return a + b;}2.变量类型numbe

1.TypeScript概述TS增加了什么？类型支持ES的新特性添加ES不具备的新特性，比如接口、枚举…丰富的配置选项，比如可以设置编译成任意版本的ES2.TypeScript开发环境搭建使用npm全局安装typescript进入命令行输入：npm i -g typescript创建一个ts文件使用tsc对ts文件进行编译进入命令行进入ts文件所在目录执行命令：tsc xxx.ts3.第一个案例新建空文件夹，创建一个hello.ts文件consol

Flow静态类型检查方案即javascript的类型检查器，能够作为解决javascript自身存在的类型系统不足问题的一种方法。原理：把我们编写的代码和实际生产环境的代码分开，中间加入编译的环节，这样就能使用js的扩展语法，因为类型检测变得可能。function sum(a: number,b) { // a: number // b: any return a + b}Flow只是一个小工具，可以为函数的参数添加注解来做类型判断，如上。安装：yarn add fl

TypeScript作为前端领域的第二门语言，随着前端领域的快速发展，未来TypeScript可能会成为前端技能的必备。原因很简单，JavaScript自身存在类型系统不足的问题，在长周期开发的大型项目中，有很多的隐患。本文先介绍语言的强类型与弱类型、静态类型与动态类型这些基础概念作铺垫，再剖析JavaScript类型系统不足的问题。文章目录一、强类型与弱类型（从类型安全的角度划分）二、静态类型与动态类型 （从类型检查的角度划分）三、JavaScript自有类型系统的问题一、强类型与弱类型（从类型安全