TypeScript和JavaScript的一些小技巧记录
项目里使用到的技巧,记录一下,会持续更新。
JS的技巧完全可以使用到TS上哦。
JS
向下取整
Math.floor(4.5); //
简写:
var num = 4.5;
~~num;
num << 0;
num >> 0;
num >>> 0;
四种写法都会返回向下取整后的值,即4。
但是要注意,简写的方式用在负数上会得到错误的结果:
Math.floor(-4.1); // -5
~~-4.1; // -4
-4.1 << 0; // -4
-4.1 >> 0; // -4
-4.1 >>> 0; //
或者说在负数上变成了向上取整,另外由于 >>> 是无符号的位移操作,所以会得到一个巨大的正数。另外一点:没有 <<< 这个操作符哦。
字符串转数字
parseInt("4.5"); //
parseFloat("4.5"); // 4.5
parseInt({a:1}); // NaN
简写:
var num = "4.5";
+num; // 4.5 num = {a:1};
+num; // NaN
转Boolean值
Boolean(5.99); // true
Boolean(0); // false
Boolean(1); // true
Boolean(null); // false
Boolean(undefined); // false
Boolean(""); // false
Boolean("1"); // true
Boolean({}); // true
简写:
!!5.99; // true
!!0; // false
!!1; // true
!!null; // false
!!undefined; // false
!!""; // false
!!"1"; // true
!!{}; // true
void 0
如果编写的代码会直接发布,尽可能用 void 0 代替 null 和 undefined,因为在某些浏览器中,undefined可以被赋值导致判断全部错误。
比如在TS中,编译后,使用到的undefined都会替换为 void 0。
TS
多使用接口方式
比如传递参数时,这么写:
func(a: Point);
只能接受Point类型的变量,如果用下面的写法:
func(a: {x:number, y:number});
就可以接受带有x和y的所有变量,可以更好的复用该函数。
快速得到属性
一般的写法:
let x = point.x;
let y = point.y;
简写:
let {x, y} = point;
一般的写法:
let arr = "100;200;300".split(';');
let a = arr[0];
let b = arr[1];
let c = arr[2];
简写:
let [a, b, c] = "100;200;300".split(';');
快速写入属性
一般的写法:
let a = 0;
let b = "heelo";
let obj = {a: a, b: b};
简写:
let a = 0;
let b = "heelo";
let obj = {a, b};
参数类类型控制
比如我们需要传递一个参数,该参数是MyClass类的类型,而不是实例时,一般只能用any,实际上是可以指定类型的,写法如下:
public func(classType: { new(): MyClass }): void;
传入类型,得到该类型的实例
一般用于工厂或对象池等:
export function getInstance<T>(Class: {new () : T}): T {
return new Class();
}
单例的简写方式
static get instance(): Obj {
return this._instance || (this._instance = new Obj());
}
类属性控制
interface IObj {
// 可选属性
name?: string;
// 只读属性
readonly age: number;
}
控制动态属性:
interface Map<T> {
[key: string]: T;
}
用接口来规范一个对象
比如我们有一个接口,可以用下面的方法来规范一个对象,而不用编写一个实现该接口的类:
export interface IPoint {
x: number;
y: number;
}
export function foo(point: IPoint) {
// ...
}
foo(<IPoint> {x: 100, y: 100});
如果打错属性名称或缺少必须的属性会报错,属性类型不匹配也会报错,可以大大降低写错的问题。另外添加额外属性是允许的。
TypeScript和JavaScript的一些小技巧记录的更多相关文章
- ( 译、持续更新 ) JavaScript 上分小技巧(三)
最近家里杂事较多,自学时间实在少的可怜,所以都在空闲时间看看老外写的内容,学习之外顺便翻译分享~等学习的时间充足些再写写自己的一些学习内容和知识点分析(最近有在接触的:复习(C#,SQL).(学习)T ...
- ( 译、持续更新 ) JavaScript 上分小技巧(四)
后续如有内容,本篇将会照常更新并排满15个知识点,以下是其他几篇译文的地址: 第一篇地址:( 译.持续更新 ) JavaScript 上分小技巧(一) 第二篇地址:( 译.持续更新 ) JavaScr ...
- ( 译、持续更新 ) JavaScript 上分小技巧(二)
考虑到文章过长,不便于阅读,这里分出第二篇,如有后续,每15个知识点分为一篇... 第一篇地址:( 译.持续更新 ) JavaScript 上分小技巧(一) 第三篇地址:( 译.持续更新 ) Java ...
- ( 译、持续更新 ) JavaScript 上分小技巧(一)
感谢好友破狼提供的这篇好文章,也感谢写这些知识点的作者们和将他们整理到一起的作者.这是github上的一篇文章,在这里本兽也就只做翻译,由于本兽英语水平和编程能力都不咋地,如有不好的地方也请多理解体谅 ...
- 19个JavaScript简化编码小技巧
这篇文章适合任何一位基于JavaScript开发的开发者.我写这篇文章主要涉及JavaScript中一些简写的代码,帮助大家更好理解一些JavaScript的基础.希望这些代码能从不同的角度帮助你更好 ...
- Javascript字符串拼接小技巧
在Javascript中经常会遇到字符串的问题,但是如果要拼接的字符串过长就比较麻烦了. 如果是在一行的,可读性差不说,如果要换行的,会直接报错. 在此介绍几种Javascript拼接字符串的技巧. ...
- docker的小技巧记录(如果使用了更多会继续添加)
docker小技巧 复制本地sql脚本到docker容器mysql中进行使用 # 找到容器 docker ps # 复制文件 cp ./xxx.sql container-id:/tmp/ # 进入容 ...
- JavaScript的一些小技巧(转)
本文是一篇翻译文章,原文信息如下: 原文:45 Useful JavaScript Tips, Tricks and Best Practices 作者:Saad Mousliki JavaScrip ...
- js_开发小技巧记录(一)
(一) 生成从minNum到maxNum的随机数 <!DOCTYPE html> <html> <head> <meta charset="UTF- ...
随机推荐
- 【java并发核心八】Fork-Join分治编程
jdk1.7中提供了Fork/Join并行执行任务框架,主要作用就是把大任务分割成若干个小任务,再对每个小任务得到的结果进行汇总. 正常情况下,一些小任务我们可以使用单线程递归来实现,但是如果要想充分 ...
- 解决ant Design dva ajax跨越请求 (status=0)
今天实现了antd作为前端展现,python flask作为后端的数据填充,完全两个独立的服务:过程中遇到ajax跨越请求问题,导致status一直等于0,原来是这么写的: xmlhttp.open( ...
- 踩坑记:Tensorflow环境搭建
自从上一篇论文投出去,之后就各种事就来了……处理那些乱七八糟的事就是让人心累,在加上师哥们毕业,能帮我的人越来越少了,而要指望你的人呢,越来越多.一想到那些用搜索引擎都搜不到资料的人,蓦地想起邓爷爷说 ...
- spark实时计算性能优化
1. 计算提供两种模式,一种是jar包本地计算.一种是JSF服务. 2. 第一步是引入spark,因与netty.JDQ均有冲突,解决netty冲突后,隔离计算为单独服务.已在线上,因storm也 ...
- 使用百度的富文本编辑器UEditor遇到的问题总结
1.下载地址:http://ueditor.baidu.com/website/download.html(我下载的是.net版本) 下载后要先看一下ueditor.config.js和 net/co ...
- CodeForces - 1089G
题目链接: http://codeforces.com/contest/1089/problem/G Example input Copy 3 2 0 1 0 0 0 0 0 100000000 1 ...
- Java并发编程(九)-- 进程饥饿和公平锁
上一章已经提到“如果一个进程被多次回滚,迟迟不能占用必需的系统资源,可能会导致进程饥饿”,本文我们详细的介绍一下“饥饿”和“公平”. Java中导致饥饿的原因 在Java中,下面三个常见的原因会导致线 ...
- java反射机制基础
java反射机制: JAVA反射机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法:对于任意一个对象,都能够调用它的任意方法和 属性:这种动态获取信息以及动态调用对象方法的功能称为j ...
- Iview-datePicker获取选中的日期,如果没有选,提示错误,选了,错误隐藏
最近遇到大坑,,最后解决了,直接上代码 npm intall iview main.js中引入 import iView from 'iview'; import 'iview/dist/styles ...
- 阿里云EDAS在本地CentOS7.5 系统搭建测试环境,部署配置中心以及部署多个war包
参考阿里云的EDAS开发文档: 使用 Ali-Tomcat 开发应用 我们自己在内网搭建CentOS7 的测试环境,需要的资源如下: Ali-Tomcat Pandora 容器 EDAS 配置中心安装 ...