极客江南: 一个对开发技术特别执着的程序员,对移动开发有着独到的见解和深入的研究,有着多年的iOS、Android、HTML5开发经验,对NativeApp、HybridApp、WebApp开发有着独到的见解和深入的研究, 除此之外还精通 JavaScript、AngularJS、 NodeJS 、Ajax、jQuery、Cordova、React Native等多种Web前端技术及Java、PHP等服务端技术。
初学者玩转 TypeScript系列,总计 10 期,本文为第 10 期,点赞、收藏、评论、关注、三连支持!
一期知识点击这里
二期知识点击这里
三期知识点击这里
四期知识点击这里
五期知识点击这里
六期知识点击这里
七期知识点击这里
八期知识点击这里
九期知识点击这里
十期目录
- 1.混入
- 2. 声明
- 3. 声明文件
对于初学者来说,学习编程最害怕的就是,难。
那么,Typescript 是不是很难?
首先,我可以肯定地告诉你,你的焦虑是多余的。新手对学习新技术有很强的排斥心理,主要是因为基础不够扎实,然后自信心不够强。
1.混入
// 1.对象混入
/*
let obj1 = {name:'lnj'};
let obj2 = {age:34};
Object.assign(obj1, obj2);
console.log(obj1);
console.log(obj2);
*/
// 2.类混入
// 需求: 定义两个类, 将两个类的内容混入到一个新的类中
class Dog {
name:string = 'wc';
say():void{
console.log('wang wang');
}
}
class Cat {
age:number = 3;
run():void{
console.log('run run');
}
}
// 注意点: 一次只能继承一个类
// class Animal extends Dog, Cat{
//
// }
class Animal implements Dog, Cat{
name:string;
age:number;
say:()=>void;
run:()=>void;
}
function myMixin(target:any, from:any[]) {
from.forEach((fromItem)=>{
Object.getOwnPropertyNames(fromItem.prototype).forEach((name)=>{
target.prototype[name] = fromItem.prototype[name];
})
})
}
myMixin(Animal, [Dog, Cat]);
let a = new Animal();
console.log(a);
a.say();
a.run();
// console.log(a.name);
// console.log(a.age);
2. 声明
/*
1.什么是声明?
- 在企业开发中我们不可避免的需要引用第三方的 JS 的库,
但是默认情况下TS是不认识我们引入的这些JS库的
所以在使用这些JS库的时候, 我们就要告诉TS它是什么, 它怎么用
- 如何告诉TS呢?
那就是通过声明来告诉
* */
declare const $:(selector:string)=>{
width():number;
height():number;
ajax(url:string, config:{}):void;
};
console.log($);
console.log($('.main').width());
console.log($('.main').height());
3. 声明文件
console.log(myName);
say('lnj', 18);
let p = new Person('zs', 666);
p.say();
/*
1.对于常用的第三方库, 其实已经有大神帮我们编写好了对应的声明文件
所以在企业开发中, 如果我们需要使用一些第三方JS库的时候我们只需要安装别人写好的声明文件即可
2.TS声明文件的规范 @types/xxx
例如: 想要安装jQuery的声明文件, 那么只需要npm install @types/jquery 即可
* */
> 码字不易,在线求个三连支持。
点击下方卡片,关注公众号 回复 **书籍** 获取原创保姆级编程电子书