js如何去除字符串前后的空格 js去除前后空格的函數 _js如何去除字符串前后的空格

文章插圖

1.Promise 用于解決異步編程/* * 比如說 ajax 就是一個異步操作 , 之前的使用的回調函數的方式解決異步編程 * * $.ajax({ * url:’abc.com’, * success:function(res){ * * } * }) * * 場景: * 1.先獲取當前token是否已經失效 * 2.如果沒有失效,返回當前的token的用戶的基本信息(基本信息包含 uid ) * 3.根據uid 來查詢當前用戶的會員等級 * 4.再通過當前用戶的會員等級,來查詢當前用戶的特權(來檢測用戶是否有權限來執行某個操作) * * 案例: * 已知a.txt 地址 ,然后需要根據a.txt 返回的結果進行下一次的查詢 ,逐一查詢到最后的結果d.txt內容 * *///使用jQuery 實現 = > 造成一個 “回調地獄”

 $.ajax({url:"data/a.txt",success:function(res){console.log('第一次:',res);//再發出下一次請求$.ajax({url:res,success:function(res){console.log('第二次',res);$.ajax({url:res,success:function (res) {console.log('第三次:',res);$.ajax({url:res,success:function (res) {console.log("第四次:",res);}})}})}})}})

2. Promise 用于解決異步編程的一種解決方案, 也可以理解是一個執行異步操作的容器,在容器中封裝好了一套處理異步的流程機制
* 1.有三種狀態：pending（進行中）、fulfilled（已成功）和rejected（已失敗）。
* 2.一旦狀態改變，就不會再變，任何時候都可以得到這個結果。從pending – > fulfilled (成功) 或者 pending -> 和rejected (失敗) , 每次只能改變一次狀態
* * 常用方法
* all()
* race()
var promise = new Promise(function(resolve,reject){//創建一個promise容器 , resolve 一個用于在處理異步成功時調用的函數 , reject 處理異步失敗的時候調用的函數 setTimeout(function(){ //通過延時定時器模擬異步 , 2000ms 結束后就可以調用成功或者失敗 console.log(‘時間到了!!!’); resolve(123456); reject(12) },2000); }); //當實例化Promise之后(已經執行異步操作) , (結果怎么樣)然后呢? then() 編寫需要執行的回調業務 promise.then(function(res){ console.log(“執行成功!”,res); },function(err){ console.log(“執行失敗!”,err); });
3.使用promise 異步編程封裝一個ajax模塊

 //使用promise 異步編程封裝一個ajax模塊function Ajax(url){//創建一個Promise實例returnnew Promise(function(resolve,reject){var xhr = new XMLHttpRequest();//綁定請求過程狀態改變事件xhr.onreadystatechange = function () {if(xhr.readyState==4){if((xhr.status >= 200 && xhr.status<=304)){resolve(xhr.responseText);}else{reject(xhr.statusText);}}}//發起請求xhr.open("get",url);xhr.send(null);});}//使用// all() 可以同時擁有幾個異步操作,如果有一個失敗 ,則觸發失敗// Promise.all([Ajax('data/a.txt'),Ajax('data/b.txt'),Ajax('data/c3.txt')]).then(function (res) {//console.log("成功:",res);// }).catch(function (err) {//console.log("失敗:",err);// })//race() 競速Promise.race([Ajax('data/a.txt'),Ajax('data/b.txt'),Ajax('data/c3.txt')]).then(function (res) {console.log("成功:",res);}).catch(function (err) {console.log("失敗:",err);})

4.使用promise 異步編程封裝一個ajax模塊

 function Ajax(url){//創建一個Promise實例returnnew Promise(function(resolve,reject){var xhr = new XMLHttpRequest();//綁定請求過程狀態改變事件xhr.onreadystatechange = function () {if(xhr.readyState==4){if((xhr.status >= 200 && xhr.status<=304)){resolve(xhr.responseText);}else{reject(xhr.statusText);}}}//發起請求xhr.open("get",url);xhr.send(null);});}//使用Ajax("data/a.txt").then(function (res) {console.log("第一次成功:",res);//調用下一次return Ajax(res);}).then(function (res) {console.log("第二次成功:",res);return Ajax(res);}) .then(function (res) {console.log("第三次成功:",res);//調用下一次return Ajax(res);}).then(function (res) {console.log("第四次成功:",res);}).catch(function () {console.log("最后請求失敗!!!");})// promise().then(()=>{},()=>{})// promise().then(()=>{}).catch(()=>{})

5.語法糖 (提供一種代碼更加簡潔,方便的做法,與之之前的實現過程相比,感覺像是吃了糖一樣美滋滋)
// var a = 10;
【js如何去除字符串前后的空格 js去除前后空格的函數】// var b = 20;
// var c = 30;
// var d = 40;//ES6實現 – 數組形式解構賦值

 let [a, b, c, d, e, f] = [10, 20, 30, 40, 50];//對象形式解構賦值 , 定義abc , hhh 變量 , 將等號右邊的foo的值賦值給abc , 等號右邊的bar的值賦值給hhhlet { foo: abc, bar: hhh } = { foo: "啊啊啊啊啊", bar: "呵呵呵呵呵" }//es6的對象中有一個簡寫方式var name = "張三";var obj = {name, // 等于 name:name,在對象中如果屬性名與屬性值的變量名一樣 ,就可以簡寫run() {console.log('奔跑方法');}}let { foo, bar } = { foo: "啊啊啊啊啊", bar: "呵呵呵呵呵" };/*使用場景 :restFul API 規范的接口{code:200,msg:"加載用戶余額數據成功!",data:[{id:123123,money:1000},{id:123123,money:1000}]}*/var obj = {data: {res: {code: 200,msg: "加載用戶余額數據成功!",data: [{id: 123123,money: 1000},{id: 123123,money: 1000}]}}}//使用ES6 解構賦值快速搞定let { code , data , msg} = obj.data.res;//需要根據返回的狀態碼 ,做出對應的提示內容(彈窗) ,將數據列表輸出在控制臺// if (obj.data.res.code == 200) {//alert(obj.data.res.msg);//console.log(obj.data.res.data);// }if (code == 200) {alert(msg);console.log(data);}

6.字符串:
* 1.新增一些常用方法:
* includes() 用于檢測字符串中是否包含指定字符. , 返回布爾值
* startsWith() 用于檢測字符的開頭是否包含指定字符 , 返回布爾值
* endsWith() 用于檢測字符串的結尾是否包含指定字符 ,返回布爾值
* padStart(length,str) 對字符串進行length長度的前補位 ,不足使用str去補
padEnd(length,str) 對字符串進行length長度的后補位 ,不足使用str去補
repeat(times) 對字符串進行times 次重復trimStart() 去除字符串開頭位置的空格
trimEnd() 去除字符串結束位置的空格
trim() 去除字符串前后的空格 * * * 2.模板字符串 * * */

var s = '10000';console.log(s.padStart(8,0));var studentName = '張三';var bookName = "<<且聽風吟>>";// document.write('<h3>'+studentName+"正在讀一本書,書名為"+bookName+'</h3>');//使用ES6的模板字符串document.write(`<h3>${studentName}正在讀一本書,書名為${bookName}</h3>`);

7.數據結構?? : 數據結構是計算機存儲、組織數據的方式。數據結構是指相互之間存在一種或多種特定關系的數據元素的集合//數據類型:存儲的數據類型(boolean , string , undefined , null , number ,object , smybol) //Set() 集合

 var set = new Set([1,2,3,4,5,5,3]);console.log(set);//1.不能直接使用下標訪問 ,一般通過一些遍歷方式得到值//2.唯一性 : 在集合的內部 ,一個相同的值 只允許出現一次 (可以用來實現數組的去重)var arr = [10,20,30,40,50,50,40,30,20,10];var arr2 = new Set(arr);console.log(arr2);arr = Array.from(arr2); //將一些集合類型數據轉換成數組//Map() 映射 , 為了解決傳統對象的鍵值對關系中, 鍵名只能以字符串數據類型的問題var obj = {20:'這是一個數字',true:"這是一個true"http:// [0,1,2]:'sssaadasad'}

8.proxy (代理) :在目標對象之前架設一層“攔截”，外界對該對象的訪問，都必須先通過這層攔截，因此提供了一種機制，可以對外界的訪問進行過濾和改寫

var man = {age: 8,state: '兒童',sex: '女',name: "張三"}//man.age = -2500; //這樣設置無法對數據可靠性,安全性做出處理 ,很容易造成數據的混亂//攔截處理 : get(在獲取屬性時會自動觸發)/ set (在設置屬性時會自動觸發) , 在這種攔截機制中做出需要攔截的操作var hanlder = {set: function (target, key, value) {console.log('正在準備設置對象的屬性...',target, key, value);if(key == "age"){if(value>=0 && value<=120){target.age = value;if(value>=0 && value<=12){ //實現在每次修改年齡的時候 ,根據修改年齡的數值決定對象屬性state的狀態 ,此處就與age屬性實現了數據的綁定,而不需要在每次設置age屬性的時候,都要去寫一遍判斷邏輯和操作statetarget.state="兒童"}else if(value>=13 && value <18){target.state = "少年";}else if(value>=19 && value <30){target.state = "青年";}else{target.state = "老年人";}}else{throw new Error('年齡輸入不合法!!');}}},get: function (target, key) {// console.log('此處應該是獲取代理目標對象屬性的攔截操作...',target,key);switch (key) {case "age":if (target.sex == '女') {return '女孩子的年齡一般不能問的!!';} else {return target.age;}break;default:return target[key];}// return '數據保密!';}}//實例化一個proxy , 其實就是對外提供的一個操作代理對象(操作時修改的就是prxoy對象,但是它會將數據再修改到目標對象上)var proxy = new Proxy(man, hanlder);console.log('年齡為:', proxy.age); //此時會觸發proxy中的get ,因為在獲取age屬性proxy.age = 30;

9.async 函數 ,異步函數 : 目的就將異步操作變成同步操作的方式編寫/** 使用關鍵字 async 聲明一個異步函數 , 在調用異步函數的之前使用await關鍵配合使用,來聲明當前執行的異步需要等待 ,等await關鍵字中的函數執行完之后 ,才會執行后邊的代碼 */

 async function timeout(time) {return new Promise((resolve, reject) => {setTimeout(() => { //模擬一個異步操作,比如說是一次ajax交互resolve(123);}, time)})}async function hello(title, time) {let s = null;await timeout(time).then((res) => {// console.log(res);s = res;});console.log(title + s);}hello("教育改變生活!!!!", 5000);