[TypeScript] 1. Catching JavaScript Mistakes with TypeScript
The TypeScript compiler is a powerful tool which catches mistakes even in vanilla JavaScript. Try it online at the TypeScript Playground, zero setup required.
Error version:
- var movie = { title: "Memento", year: 2000, IMDB: 8.5, title: "" };
- var rating = movie.imdb;
- function Point(x, x) {
- this.x = x;
- this.y = y;
- }
- Point.prototype.distance = function() {
- return Math.sqrt(x * x + y * y);
- };
- function isPast(date) {
- var now = Date().getTime();
- return date.getTime() < now;
- }
- function ask(question) {
- var answer = confirm(question);
- var answerView = document.getElementByID('answer');
- answerView.innerHTML = answer;
- }
- function handleLoad() { console.log('loaded'); }
- document.onLoad = handleLoad();
- function newCoinToss() {
- return Math.random > 0.5 ? 'HEADS' : 'TAILS';
- }
- var tosses = [1,2,3].map(newCoinToss);
- var allHeads = tosses.every(function(toss) {
- return toss = 'HEADS';
- });
- if (allHeads) console.log(allHeads.length, 'heads in a row!');
- document.addEventListener('keydown', function(event) {
- console.log(event.clientX, event.clientY);
- });
Using WebStorm, in the Terminal, it displays the error message for you.
Fixed version in TypeScript:
- var movie = { title: "Memento", year: 2000, IMDB: 8.5 };
- var rating = movie.IMDB;
- function Point(x,y) {
- this.x = x;
- this.y = y;
- }
- Point.prototype.distance = function() {
- return Math.sqrt(this.x * this.x + this.y * this.y);
- };
- function isPast(date) {
- var now = new Date().getTime();
- return date.getTime() < now;
- }
- function ask(question) {
- var answer = prompt(question);
- var answerView = document.getElementById('answer');
- answerView.innerHTML = answer;
- }
- function handleLoad() { console.log('loaded'); }
- document.onload = handleLoad;
- function newCoinToss() {
- return Math.random() > 0.5 ? 'HEADS' : 'TAILS';
- }
- var tosses = [1,2,3].map(newCoinToss);
- var allHeads = tosses.every(function(toss) {
- return toss == 'HEADS';
- });
- if (allHeads) console.log(tosses.length, 'heads in a row!');
- document.addEventListener('mousedown', function(event) {
- console.log(event.clientX, event.clientY);
- });
[TypeScript] 1. Catching JavaScript Mistakes with TypeScript的更多相关文章
- 玩转TypeScript(引言&文章目录) --初看TypeScript.
JavaScript过去一直被当作一种玩具语言存在,直到2005年以后,这门语言又开始活跃并可以说是火爆,而且随着浏览器版本的不断升级和完善,各种DOM之间的兼容性已经渐渐的被各种技术解决了,比如经典 ...
- 使用TypeScript如何提升JavaScript编程效果?
TypeScript是个什么鬼?和JavaScript有什么关系? TypeScript是由微软开发的一种可快速入门的开源的编程语言,是JavaScript的一个超集,且向这个语言添加了可选的静态类型 ...
- 使用Typescript来写javascript
使用Typescript来写javascript 前几天尝试使用haxejs来写javascript,以获得静态类型带来的益处.虽然成功了,但很快发现将它与angularjs一起使用,有一些不太顺畅的 ...
- eval5: TypeScript编写的JavaScript解释器
eval5是基于TypeScript编写的JavaScript解释器,100%支持ES5语法. 项目地址:https://github.com/bplok20010/eval5 使用场景 浏览器环境中 ...
- electron教程(番外篇二): 使用TypeScript版本的electron, VSCode调试TypeScript, TS版本的ESLint
我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google ...
- 分享:使用 TypeScript 编写的 JavaScript 游戏代码
<上篇博客>我写出了我一直期望的 JavaScript 大型程序的开发模式,以及 TS(TypeScript) 的一些优势.博客完成之后,我又花了一天时间试用 TS,用它来重构之前编写的一 ...
- CoffeeScript?TypeScript?还是JavaScript
请注意本文只是我的偏见,我努力地理解借助CoffeeScript或TypeScript之类的编译器写JavaScript代码的理由.静态编译.强类型语言和框架,我有着这些流行的.丰富的背景.我的上一份 ...
- 在TypeScript中扩展JavaScript基础对象的功能
最近工作中用到,记录一下:假设我们需要一个功能,把一个数字比如10000输出为下面的字符串格式“10,000”,一般是写一个方法,那么我希望更方便一点,直接向Number类型添加一个格式化方法,比如叫 ...
- [TypeScript] Use the JavaScript “in” operator for automatic type inference in TypeScript
Sometimes we might want to make a function more generic by having it accept a union of different typ ...
随机推荐
- MYSQL SHOW VARIABLES简介
原文地址:http://www.2cto.com/database/201108/100546.html mysqld服务器维护两种变量.全局变量影响服务器的全局操作.会话变量影响具体客户端连接相关操 ...
- Memcached总结三:Memcached常用命令及使用说明
一.存储命令 存储命令的格式: 1 2 <command name> <key> <flags> <exptime> <bytes> < ...
- 163. Missing Ranges
题目: Given a sorted integer array where the range of elements are [lower, upper] inclusive, return it ...
- 【Linux安全】查看是否存在特权用户以及是否存在空口令用户
查看是否存在特权用户 通过判断uid是否为0来查找系统是否存在特权用户,使用命令awk即可查出. [root@pentester ~]# awk -F: '$3==0 {print $1}' /etc ...
- vi编辑器的三种模式
1.命令模式(command mode)—执行命令 在该模式中,可以输入命令来执行许多种功能.控制屏幕光标的移动,字符.字或行的删除,移动复制某区段及进入Insert mode下,或者到 last l ...
- linux进程间通信方式
(1)管道(Pipe):管道可用于具有亲缘关系进程间的通信,允许一个进程和另一个与它有共同祖先的进程之间进行通信. (2)命名管道(named pipe):命名管道克服了管道没有名字的限制,因此,除具 ...
- apache配置虚拟主机的三种方式
Apache 配置虚拟主机三种方式 一.基于IP 1. 假设服务器有个IP地址为192.168.1.10,使用ifconfig在同一个网络接口eth0上绑定3个IP: [root@localhos ...
- 让人爱不释手的13套精美 Web 应用程序图标素材(转)
图标用于向用户传递信息,不管是在网页还是 Web 应用程序中都非常需要.这些小小的图标元素能够告诉用户怎么到下一页,如何添加.删除和取消等等各种操作.设计精美的图标不仅能增加界面的美观,也能够让应用程 ...
- LightOJ 1370 Bi-shoe and Phi-shoe 欧拉函数+线段树
分析:对于每个数,找到欧拉函数值大于它的,且标号最小的,预处理欧拉函数,然后按值建线段树就可以了 #include <iostream> #include <stdio.h> ...
- Strom的安装及使用
在使用storm之前,首先看zookeeper是否安装好 单机版 1.在node1上修改配置文件conf下的storm.yaml文件