node.js

任丽琼
109 阅读4分钟
1.数据格式

1.XML

  • HTML、XHTML、DHTML、XML分别是什么？HTML-网页：预定义了很多标签，我们可以使用预定义标签写出网页；XHTML-更严格的网页,比如,;DHTML-动态效果网页：在离线端网页也具有动态效果，是现有技术的整合统称HTML+CSS+JavaScript；XML：配置文件|数据格式：没有提供任何预定义标签，全靠自定义
  • XML其实就是一个后缀为.xml的文件，创建xx.xml文件；必须写上声明标签<?xml version="1.0" encoding="utf-8">,必须放在第一行第一列，否则会报错；必须写上一个根标签，而且只有一个根标签，必须是双标签。
  • 前端使用ajax去获取xml：1.路由写为xx.xml-----2.xhr.responseText换成xhr.responseXML--可以使用核心DOM去操作你需要的东西。
  1. JSON:JavaScript Object Notation:JS对象表示法，本身就是JS的一部分；作用一种数据格式类似于XML，但是比XML更简洁，更容易解析。
  • Json字符串：'[1,2,3,4]'---'{"key":value,....}'----'[{},{},{}]'----'{"name":[1,2,3,4],"ages":[1,2,3,4]}'
  • 后端把数据库的数据取出来整理为一个JSON字符串：let jsonTxt=JSON.stringify(jsonObj)
  • 前端依然使用ajax去获取响应数据，xhr.responseText;将JSON字符串解析为一个JSON对象：2种方法1.evel("("+xhr.responseText+")") 2.JSON.parse(xhr.responseText)
ajax
  1. 同步交互：用户向服务器端发起请求，直到服务器端进行响应的全过程，用户不可以做其他事情，如；异步交互：用户向服务器端发起请求，直到服务器端进行响应的全过程，用户可以去做其他事情，不需要等待，如ajax请求。
  • Ajax：Asynchronous JavaScript And XML-异步的JavaScri和XML-前端技术，1.定时器-做特效2.mongoose操作数据库的增删改查-操作数据库3.ajax-目的在不刷新页面的情况下和服务器进行交互，可以将服务器端的数据放在前端（比较验证，数据渲染）

  1. 如何使用ajax从前端获取数据，固定四步

            1.创建ajax核心对象 let xhr=new XMLHttpRequsest()
        2.建立和服务器端的连接 xhr.open("GET/POST","路由")
        3.向服务器端发送请求消息xhr.send();如果是get请求，send方法会失效，但是不能省略，必须写为xhr.send(null)。get：获取 - ajax一般都是使用get，去找服务器端那东西的 - 举例：跟安全性不挂钩的，搜索框post：发送 - 举例：跟安全性挂钩，登录、注册
        4.绑定状态监听事件xhr.onreadystatechange=()=>{
         if(xhr.readyState==4&&xhr.status==200){
 xhr.responseText - 服务器端相应的文本，ajax就难在你拿到东西了要干什么}}
静态/动态样式语言

  1. 静态样式语言css，虽说css是语言但不它并不具备语言的基础概念如变量，运算，循环，分支，函数等，导致我们在开发和维护大型项目中及其不方便。css不是人写的，是编译的。

  2. 动态样式语言：sass/scss、less，在css的基础上，添加了新特性，目的是简化css开发。

  3. 编译：浏览器只认识css不认识其他的动态样式语言，动态样式语言(编译)自动得到一个css，html真正引入的还是css

  4. scss的新特性：创建：$变量名：值；------特殊：有全局变量和局部变量，选择器内部创建则为局部变量，放在最外面的则为全局变量

  5. 嵌套：选择器嵌套：

            语法：
 	.d1{
 		...
 		.d2{
 			...
 			.d4{
 				...
 			}
 		}
 		.d3{
 			...
 			&:hover{...}
 		}
 	}
 编译后：
 	.d1{...}
 	.d1 .d2{...}
 	.d1 .d3{...}
 	.d1 .d3:hover{...}
 	.d1 .d2 .d4{...}

特殊：层级选择器由自己决定，根据需求可以在选择器前面加>，空格，+等，如果不加默认为空格。&类似于javascript中的this，被那个{}所包裹，就是那个选择器 6. 导入：@impor'文件路径'，可以将多个scss整合为一个css，并且js也能获取到css里面的代码。注释只能写多行注释，/****/ 7. 混合器：类似于javascript中的函数

       创建混合器
      @mixin 混合器($形参：默认值...){
      css属性名：css属性值；...}
      调用混合器
      @include 混合器名(实参);--注意传参顺序
      @include 混合器名($形参:实参)

8.运算符：主要用于颜色的运算，支持+ -* /越往0靠近数字越小，颜色越暗（#000000-#ffffff） 9. Less1、变量的创建：@变量名: 值;2、混合器更简单：

	创建：
		.混合起名(@形参:默认值,...){
			css属性名: css属性值;
			...
		}

	使用：
		.混合起名(@形参:实参,...)

10. async和await：async作为一个关键字放在函数前面，用于表示函数是一个异步函数，异步函数也就意味着该函数不会阻塞后续代码，有了async意味着任何函数都可以变为异步。await关键字只能放在async函数里面

           async function f1(){
			return "我是f1函数";
		}
		f1().then(rs=>{
			console.log(rs);
			console.log("得到结果要干什么就在这里操作")
		});
		console.log("后续代码");
           下面是await的使用
           async function f1(){
			return 1;
		}
		async function f2(){
			return 2;
		}
		async function f3(){
			return await f1() + await f2();
		}
		f3().then(rs=>{
			console.log(rs);
		});
		console.log("后续代码");
avatar
文章
阅读
粉丝