TypeScript学习(三):变量定义,运算符,语句,函数

//1.变量定义,var和let的区别

var t1="";

var t1="123"

let t2=123;

//let t2=456;//区别1.let重复声明会报错,var则不会,所以建议一般用let来声明变量,免得覆盖了前值

//在html文档中,存在window对象时,此时this指向window对象

console.log(this.t1); // 123

//console.log(this.t2); // 区别2.let声明的变量不会在全局对象里面创建属性,输出:undefined

//2.变量声明

var global_num = 12; // 全局变量 或使用let

class Numbers {

num_val = 13; // 实例变量

static sval = 10; // 静态变量

storeNum():void {

var local_num = 14; // 局部变量

}

}

console.log("全局变量为: "+global_num)

console.log(Numbers.sval) // 静态变量

var obj = new Numbers();

console.log("实例变量: "+obj.num_val);

//3.运算符

//3.1 算术运算符 加+ 减- 乘* 除/ 自增++ 自减-- 取模%

let a:number=200,b:number=100;

console.log(a+b);

console.log(a-b);

console.log(a*b);

console.log(a/b);

a++;

console.log(a);

a--;

console.log(a);

console.log(a%b);

/**

* 结果

* 300

* 100

* 20000

* 2

* 201

* 200

* 0

*/

//3.2 关系运算符 等于== ,不等于!=, 大于>, 小于< ,大于等于>=, 小于等于<=

var num1:number = 5;

var num2:number = 9;

console.log("num1 的值为: "+num1);

console.log("num2 的值为:"+num2);

var res = num1>num2

console.log("num1 大于n num2: "+res)

res = num1<num2

console.log("num1 小于 num2: "+res)

res = num1>=num2

console.log("num1 大于或等于 num2: "+res)

res = num1<=num2

console.log("num1 小于或等于 num2: "+res)

res = num1==num2

console.log("num1 等于 num2: "+res)

res = num1!=num2

console.log("num1 不等于 num2: "+res)

/**

* 结果

* num1 的值为: 5

num2 的值为:9

num1 大于n num2: false

num1 小于 num2: true

num1 大于或等于 num2: false

num1 小于或等于 num2: true

num1 等于 num2: false

num1 不等于 num2: true

*

*

*/

//3.3 逻辑运算符 与&& 或|| 非!

var avg:number = 20;

var percentage:number = 90;

console.log("avg 值为: "+avg+" ,percentage 值为: "+percentage);

var res:boolean = ((avg>50)&&(percentage>80));

console.log("(avg>50)&&(percentage>80): ",res);

var res:boolean = ((avg>50)||(percentage>80));

console.log("(avg>50)||(percentage>80): ",res);

var res:boolean=!((avg>50)&&(percentage>80));

console.log("!((avg>50)&&(percentage>80)): ",res);

/**

* 结果

* avg 值为: 20 ,percentage 值为: 90

* (avg>50)&&(percentage>80): false

* (avg>50)||(percentage>80): true

* !((avg>50)&&(percentage>80)): true

*/

//3.4 二进制,位运算符 按位与&, 或|, 非~, 异或^,左移<<,右移>>,无符号右移>>>

var c:number = 2; // 二进制 10

var d:number = 3; // 二进制 11

var result;

result = (c & d);

console.log("(c & d) => ",result)

result = (c | d);

console.log("(c | d) => ",result)

result = (c ^ d);

console.log("(c ^ d) => ",result);

result = (~d);

console.log("(~d) => ",result);

result = (c << d);

console.log("(c << d) => ",result);

result = (c >> d);

console.log("(c >> d) => ",result);

result = (c >>> 1);

console.log("(c >>> 1) => ",result);

/**

* 结果

(c & d) => 2

(c | d) => 3

(c ^ d) => 1

(~d) => -4

(c << d) => 16

(c >> d) => 0

(c >>> 1) => 1

*/

//3.5赋值运算符

/**

* = (赋值),+= (先进行加运算后赋值),-= (先进行减运算后赋值),*= (先进行乘运算后赋值),/= (先进行除运算后赋值)

* 类似的还有:<<=, >>=, >>>=, &=, |= 与 ^=

*

* */

var e:number = 12

var f:number = 10

e = f

console.log("e = f: "+e)

e += f

console.log("e+=f: "+e)

e -= f

console.log("e-=f: "+e)

e *= f

console.log("e*=f: "+e)

e /= f

console.log("e/=f: "+e)

e %= f

console.log("e%=f: "+e)

/**

* 结果

* e = f: 10

e+=f: 20

e-=f: 10

e*=f: 100

e/=f: 10

e%=f: 0

*/

//3.6 三元运算符 ? :

var num:number = -2

var result1 = num > 0 ? "大于 0" : "小于 0,或等于 0"

console.log(result1)

//结果:小于 0,或等于 0

//3.7 类型运算符typeof 返回数据的类型,instanceof 运算符用于判断对象是否为指定的类型

var num = 12 ;//这是js的写法,ts需要指定类型,ts兼容js语法

console.log(typeof num);

//输出结果: number

class Person{

constructor(public name:string,public age:number){};

}

const p=new Person("jacky",18);

console.log(p instanceof Person);

//输出结果: true

//3.8其他运算符 -表示取负,+字符串相连

var x = 1;

var y = -x;

console.log("x 值为: ", x); // 输出结果 1

console.log("y 值为: ", y); // 输出结果 -1

var msg:string = "good"+"job"

console.log(msg);//输出goodjob

//4.语句

//4.1条件语句 if,if else, if else if else,switch

var num:number = 5

if (num > 0) {

console.log("数字是正数")

}

//输出结果:数字是正数

var num:number = 12;

if (num % 2==0) {

console.log("偶数");

} else {

console.log("奇数");

}

//输出结果:偶数

var num:number = 2

if(num > 0) {

console.log(num+" 是正数")

} else if(num < 0) {

console.log(num+" 是负数")

} else {

console.log(num+" 不是正数也不是负数")

}

//输出结果:2是正数

var grade:string = "A";

switch(grade) {

case "A": {

console.log("优");

break;

}

case "B": {

console.log("良");

break;

}

case "C": {

console.log("及格");

break;

}

case "D": {

console.log("不及格");

break;

}

default: {

console.log("非法输入");

break;

}

}

//输出结果:优

//4.2 循环语句 for,fo...in,for...of,forEach,every,while,do while

//for 计算4的阶乘

var num:number = 4;

var i:number;

var factorial = 1;

for(i = num;i>=1;i--) {

factorial *= i;

}

console.log(factorial)

//输出结果:24

//for in 循环数组

var j:any;

var n:any = "a b c"

for(j in n) {

console.log(n[j])

}

//for of循环

let someArray = [1, "string", false];

for (let entry of someArray) {

console.log(entry); // 1, "string", false

}

//forEach循环

let list = [4, 5, 6];

list.forEach((val, idx, array) => {

// val: 当前值

// idx:当前index

// array: Array

console.log("idx="+idx+",val="+val+",array="+array);

});

/**

* 运行结果:

* idx=0,val=4,array=4,5,6

idx=1,val=5,array=4,5,6

idx=2,val=6,array=4,5,6

*/

//every循环

let list1 = [4, 5, 6];

list1.every((val, idx, array) => {

// val: 当前值

// idx:当前index

// array: Array

console.log("every,idx="+idx+",val="+val+",array="+array);

return true; // Continues

// Return false will quit the iteration

});

//运行结果同上

var num = 4;

var factorial = 1;

while (num >= 1) {

factorial = factorial * num;

num--;

}

console.log("4的阶乘为:" + factorial);

//运行结果:4的阶乘为:24

//do while循环

var n1:number = 10;

do {

console.log(n1);

n1--;

} while(n1>=0);

//break 退出当前循环体

var i:number = 1

while(i<=10) {

if (i % 5 == 0) {

console.log ("在 1~10 之间第一个被 5 整除的数为 : "+i)

break; // 找到一个后退出循环

}

i++

} // 输出 5 然后程序执行结束

//continue 继续当前循环,continue以下语句不被执行

var num:number = 0

var count:number = 0;

for(num=0;num<=20;num++) {

if (num % 2==0) {

continue

}

count++

}

console.log ("0 ~20 之间的奇数个数为: "+count) //输出10个奇数

//无限循环

for(;;) {

console.log("这段代码会不停的执行")

}

while(true) {

console.log("这段代码会不停的执行")

}

//5.函数定义function

function test(p1:string,p2:number):number {

// 函数定义

console.log("调用函数")

return 123;

}

相关推荐
Amd7942 小时前
Nuxt.js 应用中的 prepare:types 事件钩子详解
typescript·自定义·配置·nuxt·构建·钩子·类型
王解1 天前
Jest项目实战(2): 项目开发与测试
前端·javascript·react.js·arcgis·typescript·单元测试
鸿蒙开天组●1 天前
鸿蒙进阶篇-网格布局 Grid/GridItem(二)
前端·华为·typescript·harmonyos·grid·mate70
zhizhiqiuya1 天前
第二章 TypeScript 函数详解
前端·javascript·typescript
初遇你时动了情2 天前
react 18 react-router-dom V6 路由传参的几种方式
react.js·typescript·react-router
王解2 天前
Jest进阶知识:深入测试 React Hooks-确保自定义逻辑的可靠性
前端·javascript·react.js·typescript·单元测试·前端框架
_jiang2 天前
nestjs 入门实战最强篇
redis·typescript·nestjs
清清ww2 天前
【TS】九天学会TS语法---计划篇
前端·typescript
努力变厉害的小超超3 天前
TypeScript中的类型注解、Interface接口、泛型
javascript·typescript
王解3 天前
Jest进阶知识:整合 TypeScript - 提升单元测试的类型安全与可靠性
前端·javascript·typescript·单元测试