他的回复:
华为云ID:dove_yiran心得:ajax技术总的来说了解的还不是很深入,有些东西并不知道为什么仅仅是能用,而且觉得js部分黑马讲的太少了根本没什么大用处希望能改进JS对象JS中对象是一组无序的相关属性和方法的集合,如字符串、数组、函数等。创建对象的方法利用字面量:将键值对或方法放在{ }中并用逗号隔开var obj = {name='张三',age=18,sayhhh:function(){console.log('hhh');}}利用new Object:利用等号赋值来添加对象的属性和方法,用分号隔开var obj=new Object( );//空对象obj.name='张三' ;obj.sayhhh=function(){console.log('hhh');}利用构造函数:将对象里相同的属性和方法抽象出来封装到构造函数中function 构造函数名(形参){ //构造函数名首字母要大写this.属性=值;this.方法=function( ){}}var 对象名=new 构造函数名(实参);使用对象调用对象属性:对象名.属性名 或 对象名[‘属性名’]调用对象方法:对象名.方法名( )for...in遍历(重要)for(变量 in 对象){//循环体}for(var key in obj){ console.log(key);//直接输出变量key得到的是属性名 console.log(obj[key])//得到的是属性值}内置对象内置对象就是JS自带的一些对象,并提供了基本常用的属性和方法。查阅MDN文档:https://developer.mozilla.org/zh-CN/Math对象不是构造函数,不需要new可以直接使用里面的属性和方法。求最大值:Math.max(1,2,3);圆周率:Math.PI;绝对值:Math.abs(-1);向下取整:Math.floor(value);向上取整:Math.ceil(value);四舍五入就近取整:Math.round(value);注意-1.5四舍五入为-1随机数:Math.random( )返回一个范围在[0,1)的浮点数例:得到一个两数之间的随机整数,包括两个数在内function getRandomIntInclusive(min, max) { min = Math.ceil(min); max = Math.floor(max); return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值,含最小值 }Date对象Date对象基于自1970年1月1日(UTC)起经过的毫秒数创建一个新Date对象的唯一方法是通过new 操作符,例如:let now = new Date(参数);参数常用写法:数字型 2019,10,06 字符串型 '2019-10-1 8:8:8'日期格式化:var date=new Date( );date.getFullYear( ) 返回当前日期的年;date.getMonth( ) 返回当月(0-11);date.getDate( ) 返回当天几号;date.getDay( ) 返回当前星期几(0-6);date.getHours( ) 返回当前小时;date.getMinutes( ) 返回当前分钟;date.getSeconds( ) 返回当前秒;获取日期总的毫秒数:date.valueOf( ); 或 date.getTime( ); 或 var date = +new Date( ); 或 Date.now(参数);//参数为空则返回当前时间的毫秒数将秒数转换为天,时,分,秒:day=parseInt(总秒数/60/60/24);hour=parseInt(总秒数/60/60%24);minute=parseInt(总秒数/60%60);second=parseInt(总秒数%60);例:倒计时案例function countDown(time){ var nowTime= +new Date();//返回当前时间总的毫秒数 var inputTime= +new Date(time)//用户输入时间的毫秒数 var times=(inputTime-nowTime)/1000;//剩下的秒数 var day=parseInt(times/60/60/24); day=day10?'0'+day:day; var hour=parseInt(times/60/60%24); hour=hour10?'0'+hour:hour; var minute=parseInt(times/60%60); minute=minute10?'0'+minute:minute; var second=parseInt(times%60); second=second10?'0'+second:second; return day+'天'+hour+'时'+minute+'分'+second+'秒';}console.log(countDown('2020-8-6 21:45:00'));Array对象创建数组:1.利用new创建数组:var 数组名=new Array(参数); 2.利用数组字面量创建数组:var 数组名=[ ];var 数组名=['小米',1,true]; 注:数组中可以存放任意数据类型的元素,如字符串,数字,布尔型等。判断是否为数组: 1.arr instanceof Array(返回布尔值)2.Array.isArray(arr);(返回布尔值)访问数组元素:数组索引(下标):从零开始,数组名[索引],超下标的元素为undefined数组长度:数组名.length数组添加元素:push(参数1...)末尾添加一个或多个元素,修改原数组,返回新的长度pop( )删除最后一个元素,把数组长度减一,修改原数组,返回删除元素的值unshift(参数1...)在开头添加一个或多个元素,修改原数组,返回新的长度shift( )删除第一个元素,数组长度减一,修改原数组,返回第一个元素的值数组排序:reverse( ) 颠倒元素顺序,无参数,修改原数组并返回新数组sort([compareFunction]) 对元素进行排序, 修改原数组并返回新数组,compareFunction用来指定排列顺序,如果省略,元素按照转换为的字符串的各个字符的Unicode位点进行排序。如果 compareFunction(a, b) 小于 0 ,那么 a 会被排列到 b 之前例:arr.sort(function(a, b) { return a - b;//升序 return b - a;//降序});获取数组元素索引:indexOf( ) 查找给定元素的第一个索引,存在返回索引号,不存在返回-1lastIndexOf( ) 查找给定元素的最后一个索引,存在返回索引号,不存在返回-1例:数组去重function unique(arr){ var newArr=[]; for(var i=0;i newArr.push(arr[i]); } } return newArr;}数组转为字符串:toString( ) 把数组转换为字符串,逗号分隔每一项,返回新字符串join('分隔符') 把数组中所有元素转换为一个字符串,返回新字符串其他方法:concat( ) 连接两个或多个数组,不影响原数组,返回一个新的数组slice(begin,end ) 截取原数组[begin,end),不影响原数组,返回被截取下来的新数组splice(begin,length) 原数组从begin开始截取length个,影响原数组,返回被截取下来的新数组String对象字符串长度:str.length字符串不可变性:看上去可以改变内容,其实是地址变了,内存中开辟了新空间,故不宜大量拼接字符串字符串所有方法都不会修改字符串本身,操作完成后都会返回一个新的字符串根据字符返回位置:indexOf('要查找的字符',起始位置 ) 存在返回给定元素的第一个位置,不存在返回-1lastIndexOf( ) 查找给定元素的最后一个位置,存在返回索引号,不存在返回-1例:查找字符串中某个字符出现的位置和次数function find(str,ch){ var index=str.indexOf(ch); var number=0; while(index!=-1){ console.log(index); number++; index=str.indexOf(ch,index+1); } console.log('次数为:'+number);}根据位置返回字符:charAt(index) 返回指定位置的字符charCodeAt(index) 返回指定位置处字符的ASCII码str[index] 获取指定位置处字符例:统计字符串中出现次数最多的字符function find(str){ var obj={}; for(var i=0;i/如果有这个字符 obj[ch]++; }else{//没有这个字符 obj[ch]=1; } } var max=0; var c=''; for(var key in obj){//找出出现次数最多的字符 if(obj[key]>max){ max=obj[key]; c=key; } } console.log('最多的字符是:'+c+',一共出现次数为'+max);}字符串拼接和截取:concat(str1,str2... ) 连接两个或多个字符串,等效于+substr(begin,length) 从begin开始取length个字符slice(begin,end ) 截取原串[begin,end),不影响原字符串,返回被截取下来的新字符串substring(begin,end ) 截取原串基本和slice相同,但是不接受负值替换字符串:replace('被替换的字符','替换字符'),只替换第一个字符字符串转换为数组:split('分隔符') 将字符串按指定分隔符分成数组元素字符转换大小写:toUpperCase( ); toLowerCase( )JS函数与预解析函数:封装的一段可以被重复调用执行的代码块函数的使用声明函数:命名函数:function 函数名(形参1,形参2){函数体(return ...只能返回一个值,若返回多个值则只能返回最后一个值,如果没有return则返回undefined)}匿名函数:(函数表达式)var 变量名=function(形参1,形参2 ){ 函数体}形参的默认值为undefined.调用函数:命名函数:函数名(实参1,实参2);匿名函数:变量名(实参1,实参2);arguments使用arguments是当前函数的一个内置对象,存储了传递的所有实参。arguments展示形式是一个伪数组:可以进行遍历具有length属性按索引方式存储数据不具有数组的push,pop等方法作用域全局作用域:整个script标签,或者是一个单独的JS文件局部作用域:函数内部注:如果在函数内部没有声明直接使用的变量为全局变量全局变量只有浏览器关闭时才销毁,占内存作用域链:内部函数可以访问外部函数的变量,采取链式往外查找并采用就近原则预解析预解析----->代码执行变量预解析:把所有变量声明提升到当前作用域最前面,不提升赋值例:console.log(num);var num=10;预解析:var num;console.log(num);num=10; //输出结果为undefined例:fun();var fun=function(){ console.log(111);}预解析:var fun;fun();fun=function(){ console.log(111);} //报错故函数表达式调用必须写在函数表达式下面函数预解析:把所有函数声明提升到当前作用域最前面,不调用函数例:fun();function fun(){console.log(111);} 预解析:function fun(){console.log(111);} fun(); //正常调用经典例:预解析://最后输出:9 9 9 9 9 报错AJAXAJAX初识Asynchronous JavaScript And XML(异步的JavaScript和XML)AJAX优势:大幅提升用户体验减轻服务器端压力异步加载,局部更新前端通过AJAX技术从后端服务器中获取数据分层模型:从下往上物理层数据链路层---交换机网络层---路由器传输层---TCP&UDP应用层网络接口层=物理层+链路层Node.js服务Node.js是基于Chrome's V8引擎的JavaScript运行时环境,将JS引擎放到服务器端,让JS可以运行在服务器端。npm:node package management 包管理器Koa框架:一种新的Web框架koa项目生成器:koa-generator全局安装koa-generator:npm install koa-generator -g搭建web服务器使用koa2+项目名命令创建web项目使用npm install 安装依赖包使用npm start运行项目,可在浏览器中localhost:3000查看用vscode打开项目文件夹AJAX的实现(原生)XHR(XMLHttpRequest):浏览器发送XHR请求到服务器方法:open 初始化请求的XHR对象send 发送请求setRequestHeader Content-type 若请求是以post发送时需要使用该方法设置Content-type参数属性:onreadystatechange readyState发生改变时会触发该属性改变readyState XHR的状态status 请求的状态码responseText 请求返回的数据使用AJAX:客户端浏览器四步走发送XHR请求创建XMLHttpRequest使用open方法,初始化请求参数,open(method,url,async)若使用的method为post,则需setRequestHeader("content-type","application/x-www-form-urlencoded")使用send方法,发送请求,send( )若使用的method为post,需有参数send(param)使用onreadystatechange属性,接受返回数据readyState:4 status:200 请求成功并返回数据服务器端:接受请求返回数据跨域请求同源策略:浏览器的安全策略,协议名+主机名+端口号跨域的例子:https://www.huawei.com与http://www.huawei.comhttps://www.huawei.com与https://www.huaweicloud.comhttps://www.huawei.com与https://www.huawei.com:81跨域方法:JSONP天然可跨域的标签:script(img, link)JQuery中的AJAX将下载的jQuery.js文件放到web项目中的public->javascript中在layout.pug中将jquery.js文件导入,导入成功后F12的network中的js部分可以看到接下来可以使用jQuery的语法写代码了get方法:$.get(url,data,callback,type)url是请求的接口地址data是请求的参数,格式可以是json对象也可以是字符串callback是请求成功时的回调函数type是请求返回数据的格式,可以是JSON,HTML,Script,XML,Text等除了url,其他三个参数如果没有可以省略post方法:$.post(url,data,callback,type)url是请求的接口地址data是请求的参数,格式可以是json对象也可以是字符串callback是请求成功时的回调函数type是请求返回数据的格式除了url,其他三个参数如果没有可以省略post请求发出去时请求参数放在请求体中ajax方法:$.ajax(option),option是JSON格式的配置参数,用于设置ajax请求option中的配置项:url:发送请求的地址type:请求方式(get or post)data:请求参数dataType:返回的数据类型(json,html,xml)success:请求成功后的回调函数error:请求失败后的回调函数complete:请求完成后的回调函数,不论成功与否都执行布尔类型的配置:async:是否为异步请求 cache:是否进行缓存(针对get请求)容易被忽视的配置:timeout :请求超时时间(ms)