JS入门学习

JS

为什么用node.js

在Node.js之前JavaScript是一项完全的客户端技术,被用于浏览器中实现各种动画,对DOM的操作等等。而后端,即服务端则是由PHP、Python、Ruby、Java等等语言来实现。Node.js的出现,使得前后端使用同一种语言,统一模型的梦想得以实现。

同时,Node.js还带来了许多别的后端技术所不具备,或是不完善的优点,如其他人回答中的事件驱动,异步编程,非阻塞式io等等。

传统的前后端合作方式是

  • 前后端分离,通过 http 接口连接
  • 前端:开发页面,调用 http 接口获取、渲染数据
  • 后端:实现 http 接口,接收和返回数据

这样做的好处就是前后端职责分明,各司其职。而坏处也很明显:http 接口很容易混杂。特别是系统比较大,业务复杂,开发新功能升级旧功能,一段时间之后,你会发现 http 接口列表已经混乱不堪。

我们无法决定业务复杂度以及业务变化频率,但我们可以从系统设计上来减少参与业务的人和角色。即让后端人员更“靠后”一些,不要参与到业务中来,而更多关注数据和底层计算层面。其中前端也会更“靠后”一些,负责开发业务相关的 http 接口,即大前端模式。大前端模式还可以无缝接入 SSR ,无论是 vue React 框架还是传统的 nodejs 模板引擎都可以。

大前端模式,让前端人员既开发页面,又实现业务接口,这样能最大程度的保障接口统一,也没有那么多的跨部门能沟通成本,也就提高了工作效率。而大前端最重要的环节,就是 nodejs 这一层,因为我们要用它来实现接口层。

1.JS组成

JS语法与JS API(DOM与BOM)

image-20220215122138309

JS语法

image-20220215122544535

JS API

image-20220215122530532

image-20220215122742518

js三种写法:行内式,内嵌式,外部引入式。

三种JS输入输出方式:

image-20220215131754804

2.JS语法

变量声明:var name

script行间使用分号;

数据类型:typeof name 返回变量数据类型

数字:整数,浮点数。

进制:八进制,前加0,十六进制,前加0x

非数字:infinity 无穷大,超过语言设置的最大值。NAN:非数字,字符或不同数据类型加减乘除等操作。

声明未赋值,为undefined ,空值null,代表什么都没有,内存字节全零。

字符串:常用函数,str.length。用+拼接时,有一个字符(空字符也算),整体为字符

image-20220215141121717

image-20220215141056774

switch语法:

image-20220215141559524

for循环:

image-20220215141836549

断点调试:

image-20220215142042064

数组:

利用中括号:[1,2,3,4,5].var arr = [],数组中的数据不一定数据类型一致

利用new创建:var arr = new Arrary();

image-20220215154440497

数组遍历:

image-20220215143057547

冒泡排序:

每一轮按顺序两两比较,剩余未正确排序的数会像气泡一样浮上来。第一轮最大的数浮上来,第二轮第二大的数浮上来。

函数:arguements内置参数。

image-20220215144842811

js作用域:

全局:一个js标签或js文件。全局变量函数内部也可使用。函数内为声明直接赋值的变量也为全局变量。

局部:函数内部的变量。

函数内使用变量注意不能与全局变量重名,除非明确修改全局变量,此时在函数内使用全局变量不能再次定义,否则成为局部变量,不能影响全局。

块级作用域:{}中的变量。如if{},for{}

image-20220215154814073

预解析:将变量声明(不包括赋值)与函数定义提升最前面。

对象:

创建空对象

  1. var obj = {}

对象内部的属性以及方法使用键值对的方式。

属性或方法内部使用逗号隔开

方法冒号后面是匿名函数。

属性的使用:对象.属性 或 对象['属性']

方法的使用:对象.方法名()

  1. 使用new创建对象:

image-20220215152210746

构造函数:将对象中一些共有的属性,方法抽象出来封装到函数中。在构建对象时使用。

image-20220215153121962

对象属性的遍历:

image-20220215153558719

内置对象:

Math ,Date , Arrary ,String

3.Web API

image-20220215154620592

posted @ 2022-05-23 22:35  killens  阅读(50)  评论(0编辑  收藏  举报