javaScript&ES6&jQuery

前言

工作中學習和使用過程中遇到的開發問題和發現
博客地址：芒果橙的個人博客 【http://mangocheng.com】

一、原生js

1. 新發現

• 刪除對象屬性：delete this.object.propertyName

• splice(index,howmany[,item1,…item6]) 從數組中添加/刪除項目： index–必需。整數，規定添加/刪除項目的位置，使用負數可從數組結尾處規定位置。 howmany–必需。要刪除的項目數量。 item–向數組中添加是新數據

• 圖片上傳：https://www.cnblogs.com/dearxinli/p/4717047.html

• window.opener父窗口對象 ，如使用彈窗打開新窗口：Aparent打開新窗口Bson，Bson裏使用則調用到了Aparent窗口對象

• 事件的傳遞：postMessage和addEventListener

• js事件多次初始化，造成點擊一次，觸發多次事件的問題，所以要先清空事件再添加：

  $("#belongBtn").off("click").on("click",function() {
  self.belongYsxx();
  });
  

• 控制檯輸出美化

  console.log("%c[複用,id] " + id + ":", "color: blue;font-size:13px");
  

---

二、ES5/6

1. ES6

1. 箭頭函數()=>{ }
   ()中是放參數的，如果參數只有一個，那麼()可以省略；並且如果() 中的直接作爲返回值，那麼{}也可以直接省略
   x => xx
   上面的箭頭函數相當於
   function(x){ return xx; }
2. 常量:const PI=3.1415
3. 作用域：實現作用域隔離 { }
4. this：指向定義時的函數體
5. 異步對象Promise： new Promise((resolve,reject)=>{ // 異步方法 }); 調用方獲取到該對象，可繼續.then
   點擊傳送

2. 其他

1. let、var、const變量的區別

   • var：可以重複定義同一個變量名；沒有塊級別作用域；會自動提升作用域頂端；定義了就成爲全局對象window的屬性
   • let：同作用域內不可以重複定義同一個變量；有塊級別作用域，會有暫時性死區，必須先聲明才能使用；不會成爲全局對象的屬性（window）
   • const：常量，必須賦值且值不可變；修飾對象時，指向的對象不變，但對象內部的值(屬性)可變；不會影響到window
   • const和let有很多的相同點，區別就是const賦值後不可變
     參考鏈接1 、參考鏈接2
   • 使用場景：默認使用const去定義全局變量；值需要改變使用let，替代var

2. 異步變“同步”的方法，api調用方法後，再繼續調用.then方法： api.getRyxx(()=>{}).then(()=>{});

3. 數組包含數據的方法：arr.incluedes(“name”);

4. 字符串方法

   // 替換
   str.replace("{{}}","res");
   

---

三、jQuery

1. 相關知識點

1. select 下拉選擇框的事件

<select id="mySelect">  
　　<option value="1">one</option>  
　　<option value="2" selected="selected">two</option>  
　　<option value="3">three</option>  
</select>

$(document).ready(function(){  
　　　　$('#mySelect').change(function(){  
　　　　　　alert($(this).children('option:selected').val());  
　　　　　　var p1=$(this).children('option:selected').val();//這就是selected的值  
　　　　　　var p2=$('#param2').val();//獲取本頁面其他標籤的值  
　　　　　　window.location.href="xx.php?param1="+p1+"m2="+p2+"";//頁面跳轉並傳參  
　　　　})  
})  

2. 刪除子元素

$(".p").empty();	//不會刪除自己		//刪除內部所有子節點
$(".p").remove();	//會刪除自己			//刪除當前子節點(綁定的不能用)
$(".p").detach();	//會刪除自己			//刪除當前子節點(綁定的能用)

3. 獲取子元素中，所有被選中的複選框

 $(".parent").find("input[type=checkbox]:checked")

4. each 循環中，return false就是相當於continue,而return true就是相當於break