遞歸調(diào)用

• 遞歸調(diào)用，方法自己調(diào)用自己(重復(fù)執(zhí)行方法中的邏輯）
  • 1.在方法內(nèi)部調(diào)用自己的方法寫在return
  • 2.設(shè)置邊界條件，讓遞歸調(diào)用停下來

function fn(n) {if(n == 1){return 1;}return n + fn(n-1);}console.log(fn(100));//5050 復(fù)制代碼 function fn(n) {if(n === 1){return 1;}if(n%2 === 1){return n * fn(n - 2);}else if(n%2 === 0){return fn(n - 1);}}console.log(fn(10));//945 復(fù)制代碼

快速排序

• 思路：先取出數(shù)組的中間項，將數(shù)組的其他項和中間項比較，若比中間項小則放在左手邊，若比中間項大則放在右手邊。左手和右手邊再重復(fù)上述操作，最后將所有的數(shù)合并在一起。

var a = [1,7,4,5,8,3,77,45,86,93,34,52];//先獲取中間項索引function quickSort(n) {//處理邊界if(n.length <= 1){return n;}var pointIndex = Math.floor(n.length/2);//通過中間索引，把中間項從數(shù)組中刪除var pointView = n.splice(pointIndex,1)[0];var left = [];//左手邊var right = [];//右手邊for(var i = 0; i < n.length; i++){if(n[i] <= pointView){left.push(n[i]);}else{right.push(n[i]);}}return quickSort(left).concat(pointView,quickSort(right));}console.log(quickSort(a));//[1, 3, 4, 5, 7, 8, 34, 45, 52, 77, 86, 93] 復(fù)制代碼

string案例1

• 如何格式化url地址中問號傳參（qreryString）部分？
  • 1.先拿到？的索引
  • 2.拿到？后的參數(shù)部分str
  • 3.將字符串按照&拆分成數(shù)組的每一項
  • 4.將ary數(shù)組中每一項再按照=拆分成數(shù)組的每一項
  • 5.把數(shù)組ary1和ary2中的第一項作為屬性名，第二項作為對象的屬性值

var url = "https://www.twitch.tv?name=tw&age=8";function queryUrl(url) {var obj = {};var index = url.indexOf("?");//拿到？的索引var str = url.slice(index + 1);//截取？后的部分var ary = str.split("&");for(var i = 0; i < ary.length; i++){var cur = ary[i];var arr = cur.split("=");obj[arr[0]] = arr[1];}return obj;}console.log(queryUrl(url)); 復(fù)制代碼

DOM部分

• 瀏覽器渲染時，頁面上的內(nèi)容會渲染成有層次結(jié)構(gòu)的節(jié)點，一個頁面只有一個根節(jié)點document，根節(jié)點下根元素只有一個，就是HTML標簽
• 文檔 -> 文檔節(jié)點
• 文本 -> 文本節(jié)點
• 注釋 -> 注釋節(jié)點
• 標簽 -> 元素節(jié)點

節(jié)點nodeName(節(jié)點名稱)nodeType(節(jié)點類型)nodeValue(節(jié)點內(nèi)容)

文檔節(jié)點	#document	9	null
文本節(jié)點	#text	3	文本的內(nèi)容（包括換行）
注釋節(jié)點	#comment	8	注釋的內(nèi)容
元素節(jié)點	大寫的標記名	1	null

DOM節(jié)點間相互關(guān)系的屬性

• 1.childNodes 所有的子節(jié)點（文本節(jié)點，元素節(jié)點，注釋節(jié)點）
• 2.children 所有的子元素
• 3.firstChild 第一個子節(jié)點
• 4.firstElementChild 第一個子元素節(jié)點 （ie6~ie8不支持）
• 5.lastChild 最后一個子節(jié)點
• 6.lastElementChild 最后一個子元素節(jié)點
• 7.nextSibling 相鄰弟弟節(jié)點
• 8.nextElementSibling 相鄰弟弟元素節(jié)點
• 9.previousSibling 相鄰哥哥節(jié)點
• 10.previousElementSibling 相鄰的哥哥元素節(jié)點
• 11.parentNode 父元素節(jié)點

獲取DOM元素

• ID名 document.getElementById("ID名")
• 標記名context.getElementsByTagName("標簽名")
• 類名context.getElementsByClassName("類名")
• name屬性 在標準瀏覽器對所有元素起作用，在IE瀏覽器下只對表單元素起作用
  • context.getElementsByName("")
• 選擇器 document.querySelectorAll() 獲得一組元素 移動端常用 - document.querySelector() 獲得一個元素 移動端常用
• 設(shè)置DOM元素的自定義屬性：
  • ele.setAttribute(key,value);
  • ele.getAttribute();

轉(zhuǎn)載于:https://juejin.im/post/5b8683016fb9a019fe685949

總結(jié)

以上是生活随笔為你收集整理的前端基础12：递归调用，快速排序和简单DOM元素操作的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。