typescript学习之旅----数据类型及函数、传参、重载等

typescript中为了使编写的代码更规范，更有利于维护，增加了类型校验，在typescript中主要给我们提供了以下数据类型

        布尔类型（boolean）
        数字类型（number）
        字符串类型(string)
        数组类型（array）
        元组类型（tuple）
        枚举类型（enum）
        任意类型（any）
        null 和 undefined
        void类型
        never类型

console.log('ts')
var str: string = '你好'
var flag: boolean = false;
// flag=123 错误类型
var num: number = 123
num = 234
//  num = 'str';    错误
var str: string = '123'
// str = 123 错误
// ts中定义数组有两种方式
// 数组中所有数据都为number
var arr: number[] = [11, 22, 33]
// 第二种
var arr2: Array<number> = [11, 22, 33, 44]
// 元组类型（tuple） 属于数组的一种
// 给每个位置指定数据类型
let arr3: [number, string] = [11, 'ts']
//3、第三种
var arr4: any[] = ['131214', 22, true];
console.log(arr3);
// 枚举类型
/*
枚举类型（enum）
    随着计算机的不断普及，程序不仅只用于数值计算，还更广泛地用于处理非数值的数据。
    例如：性别、月份、星期几、颜色、单位名、学历、职业等，都不是数值数据。  
    在其它程序设计语言中，一般用一个数值来代表某一状态，这种处理方法不直观，易读性差。
    如果能在程序中用自然语言中有相应含义的单词来代表某一状态，则程序就很容易阅读和理解。
    也就是说，事先考虑到某一变量可能取的值，尽量用自然语言中含义清楚的单词来表示它的每一个值，
    这种方法称为枚举方法，用这种方法定义的类型称枚举类型。
        
            enum 枚举名{ 
                标识符[=整型常数], 
                标识符[=整型常数], 
                ... 
                标识符[=整型常数], 
            } ;    

 */
enum Flag { success = 1, error = 2 }
let s: Flag = Flag.success
console.log(s)
// enum Color {blue,red,'orange'};
// var c:Color=Color.red;
// console.log(c);   //1  如果标识符没有赋值 它的值就是下标

// enum Color { blue, red = 3, 'orange' };
// var c: Color = Color.red;
// console.log(c);   //3
// var c: Color = Color.orange;
// console.log(c);   //4
enum Err { 'undefined' = -1, 'null' = -2, 'success' = 1 };
var e: Err = Err.success;
console.log(e);

// 任意类型（any）
// var num: any = 123;
// num = 'str';
// num = true;
// console.log(num)
var oBox: any = document.getElementById('box');
oBox.style.color = 'red';
// null 和 undefined  其他（never类型）数据类型的子类型
// var num:number;
// console.log(num)  //输出：undefined   报错
// var num:undefined;
// console.log(num)  //输出：undefined  //正确
//一个元素可能是 number类型 可能是null 可能是undefined
var num2: number | null | undefined;
num2 = 1234;
console.log(num2)
// void类型 typescript中的void表示没有任何类型，一般用于定义方法的时候方法没有返回值。
//表示方法没有返回任何类型
//正确写法
function rua(): void {
  console.log('run')
}
rua();
// never类型:是其他类型 （包括 null 和 undefined）的子类型，代表从不会出现的值。这意味着声明never的变量只能被never类型所赋值。
var a: never;
//    a=123; //错误的写法
a = (() => {
  throw new Error('错误');
})()


// 函数的定义
function run(): string {
  return 'run'
}
run();
// 匿名函数
var fun2 = function (): number {
  return 123
}
// ts中定义方法传参
function getInfo(name: string, age: number): string {
  return `${name}---${age}`
}
getInfo('ts', 1)
// 匿名函数
var getInfos = function (name: string, age: number): string {
  return `${name}---${age}`
}
// 没有返回值的方法yong void
function run2(): void {
  console.log('ts')
}
run2()

// 方法选参数
// es5里面方法的实参和行参可以不一样，但是ts中必须一样，如果不一样就需要配置可选参数
// 加个？表示可选 //注意:可选参数必须配置到参数的最后面
function getInfo3(name: string, age?: number): string {
  if (age) {
    return `${name} --- ${age}`;
  } else {
    return `${name} ---年龄保密`;
  }
}
alert(getInfo3('1'))
alert(getInfo3('1', 123))

// 默认参数
// es5里面没法设置默认参数，es6和ts中都可以设置默认参数
function getInfo4(name: string, age: number = 20): string {
  if (age) {
    return `${name} --- ${age}`;
  } else {
    return `${name} ---年龄保密`;
  }
}
// alert( getInfo4('张三'));
alert(getInfo4('张三', 30));

// 剩余参数
function sum(a: number, b: number, c: number, d: number): number {
  return a + b + c + d;
}
alert(sum(1, 2, 3, 4));
//三点运算符 接受新参传过来的值
function sum2(...result: number[]): number {
  var sum = 0;
  for (var i = 0; i < result.length; i++) {
    sum += result[i];
  }
  return sum;
}
alert(sum2(1, 2, 3, 4, 5, 6));
// 另一种写法  先赋值a
function sum3(a: number, b: number, ...result: number[]): number {
  var sum = a + b;
  for (var i = 0; i < result.length; i++) {
    sum += result[i];
  }
  return sum;
}
alert(sum3(1, 2, 3, 4, 5, 6));

// 3.5、ts函数重载
// java中方法的重载：重载指的是两个或者两个以上同名函数，但它们的参数不一样，这时会出现函数重载的情况。
// typescript中的重载：通过为同一个函数提供多个函数类型定义来试下多种功能的目的。
// ts为了兼容es5 以及 es6 重载的写法和java中有区别。
//es5中出现同名方法，下面的会替换上面的方法 
/*
    function css(config){
    }
    function css(config,value){
    }
*/
//ts中的重载
function getIn(name: string): string;
function getIn(age: number): string;
function getIn(str: any): any {
  if (typeof str === 'string') {
    return '我叫：' + str;
  } else {
    return '我的年龄是' + str;
  }
}
alert(getIn('张三'));   //正确
alert(getIn(20));   //正确
// alert(getInfo(true));    //错误写法 ,没有布尔值的判断
function getName(name: string): string;
function getName(name: string, age: number): string;
function getName(name: any, age?: any): any {
  if (age) {
    return '我叫：' + name + '我的年龄是' + age;
  } else {
    return '我叫：' + name;
  }
}
alert(getName('zh'));  /*正确*/

// alert(getName(123)); 错误

alert(getName('zh', 20));