Js和Ts学习总结

JavaScript

JavaScript是一门客户端脚本语言，运行在客户端浏览器中，每一个浏览器都有JavaScript解析引擎。他是一种脚本语言：不需要编译，直接就可以被浏览器解析执行。可以增强用户和html的交互。

引入方式

1.在head标签或者body标签中使用script标签书写javascript.
2.使用script标签引入单独的javascript中,其中src属性专门用来引入js文件路径。

命名变量

var 变量名；

关系比较

===表示全等于，比较数值和数据类型;同时，在javaScript中string和int关系与Java中不同,在java中任何类型都能看成bool型来判断。null,0,空字符串,undefin为假。

数组定义

var 数组名=[];

函数

1.定义:function 函数名(形参列表){ 函数体 }(含参不用声明参数类型)
2.返回类型，直接在函数体内return即可
3.第二种定义方式:var 函数名=function(形参列表){ 函数体 }
4.不允许重载函数
5.arguments:隐性函数(类似于数组)
6.object形式的自定义对象:
var 变量名=new object();

事件(重点)

事件的注册

1.静态注册事件:通过html标签的事件属性直接赋予事件响应后的代码，这种方式叫做静态注册。
2.动态注册事件:是指光通过js代码得到标签的dom对象，然后再通过dom对象.时间名=function(){}这种形式注册。

OnLoad事件

onload事件是浏览器解析页面之后就会自动触发的事件。
静态:在head中用script定义一个方法，然后再body οnlοad="方法"中进行加载。
动态:window.οnlοad=function(){}

OnClick事件

静态:在head中script中定义一个方法后，在button等按钮标签内添加οnclick=“方法”
动态:给标签加上id属性，var 对象=document.getElementById(“id名”)
对象名.οnclick=function(){}

OnBlur事件

静态:输入框中input type=“text” οnblur=''调用方法"
动态;对象名.οnblur=function(){};

OnChange事件

静态:标签中 οnchange=“”.
动态:对象名.onChange=function(){};

OnSubmit事件

静态:通常在form标签中添加onSubmit=“”
动态:对象名.onSubmit=function(){};

TypeScript

TypeScript是JavaScript类型的超集（当前我们处于ES5），它可以编译成纯JavaScript。
TypeScript给JavaScript加上可选的类型系统，给JavaScript加上静态类型后，就能将调试从运行期提前到编码期，诸如类型检查、越界检查这样的功能才能真正发挥作用。 TypeScript的开发体验远远超过以往纯JavaScript的开发体验，无需运行程序即可修复潜在bug。
TypeScript支持未来的ES6甚至ES7。在TypeScript中，可以直接使用ES6的最新特性，在编译时它会自动编译到ES3或ES5。
TypeScript可以构建大型程序，并在任何浏览器、任何计算机和任何操作系统上运行，且是开源的。

TS配置

第一次听说ts还是在Vue3中接触,同时ts也需要node.js作为前提。

变量定义

let和const通常在ts中都是用来定义一些基本数据的，并且如果需要获取他们的值通常是需要通过变量名.value来get他们对应的值。

数组

在ts中数组的声明和js类似:let 变量名:Array数据类型[]=[],也可以使用var

函数

ts给我函数构造感觉就类似于高级语言的声明类似:
const 函数名=(参数名:参数类型):返回类型 =>{return }
ts跟js函数不同的一点就是在ts中函数是可以去重载的，同一函数名可以有多种传参方式，大大的提高了复用率。

Class类

这里的类定义机器像java,cpp等面向对象语言：
class 类名 {
public(private,protected) 变量名:变量类型
constructor(这里就是上述变量名的赋值)，可以当作类中的构造函数。{}
}

也可以使用interface来定义类,同时ts中的类是满足继承extends关系的。大致定义如:class A extends B{}这样A就能获得B中的非私有属性和方法了。

总结

对于ts对于我本人来说又喜又悲，因为他的对象型方式的定义对于java爱好者来说十分的吸引，但是当我在vue3中尝试ts写script部分时，就发现他很多地方的约束并不是那么简单就能解决的。需要十分的去遵守他的规范性。这也激发了我对ts的兴趣