Javascript學(xué)習(xí)日志

Writen By CoolGhost,Started With 2016/10

• 訪問JS屬性的兩種方式
  person.lastName person["lastName"]
• 如果把值賦給尚未聲明的變量察藐，該變量將被自動作為全局變量聲明
  • 此處可使用 window.carName

    function myFunction() {
        carName = "Volvo";
    }
    

  • 此處可調(diào)用 carName 變量

    function myFunction() {
    carName = "Volvo";
    // 此處可調(diào)用 carName 變量
    }
    

• js中的轉(zhuǎn)義
  \' 單引號\" 雙引號\\ 反斜杠\n 換行\r回車\t tab(制表)\b 退格符\f換頁符
• 類型判斷

  function User(name , age){
  this.name=name;
  this.age=age;
  }
  var u=new User();
  console.log( 'typeof u  :'+typeof u );  
  //輸出object  
  //顯然,使用typeof判斷復(fù)雜類型的對象,就失效了,但使用constructor就可以獲取其真實類型
  console.log( 'u.constructor.name  :'+u.constructor.name );   //user
  

• JS代碼塊的Break

  cars=["BMW","Volvo","Saab","Ford"];
  list:{
      document.write(cars[0] + "<br>"); 
      document.write(cars[1] + "<br>"); 
      document.write(cars[2] + "<br>"); 
      break list;
      document.write(cars[3] + "<br>"); 
      document.write(cars[4] + "<br>"); 
      document.write(cars[5] + "<br>"); 
  }
  

  以上代碼生成了名為list的代碼塊式散，并且break進行了跳出螟深，同時continue 具有相同作用，不過只能應(yīng)用于循環(huán)姿锭，而通過標(biāo)簽，break能夠適用于任何js代碼塊
• null和Undefined 區(qū)別：

  typeof undefined             // undefined
  typeof null                  // object
  null === undefined           // false
  null == undefined            // true
  

• JS對象類型：
  • 在 JavaScript 中有 5 種不同的數(shù)據(jù)類型：
    string,number,boolean,object,function
  • 3 種對象類型：
    Object,Date,Array
  • 2 個不包含任何值的數(shù)據(jù)類型：
    null,undefined
  • 同時注意typeof方法中：
    NaN 的數(shù)據(jù)類型是 number
    數(shù)組(Array)的數(shù)據(jù)類型是 object
    日期(Date)的數(shù)據(jù)類型為 object
    null 的數(shù)據(jù)類型是 object
    未定義變量的數(shù)據(jù)類型為 undefined
• JS的try catch throw

  try{ 
      var x=document.getElementById("demo").value;
      if(x=="")    throw "值為空";
      if(isNaN(x))  throw "不是數(shù)字";
      if(x>10)     throw "太大";
      if(x<5)      throw "太小";
  }
  catch(err){
      var y=document.getElementById("mess");
      y.innerHTML="錯誤：" + err + "谴麦。";
  }
  

• JS的調(diào)試方法包括使用debugger痊远，不過使用該方法需要打開瀏覽器調(diào)試工具
• JS中如果String類型需要分行，要使用\

  var x = "Hello \
  World!";
  

• 程序塊的作用域
  在每個代碼塊中 JavaScript 不會創(chuàng)建一個新的作用域刚陡，一般各個代碼塊的作用域都是全局的惩妇。以下代碼的的變量 i 返回 10，而不是 undefined：

  for (var i = 0; i < 10; i++) {
  // some code
  }
  return i;
  

• JS自調(diào)用函數(shù)
  以下是筐乳，最前最后加括號歌殃，還有一些類似的方法，但是這個可讀性比較高

  (function() {
      alert(1);
  }());
  

• JS沒有強制要求參數(shù)數(shù)量和函數(shù)調(diào)用時的參數(shù)數(shù)量相同蝙云，即:

  x = findMax(1, 123, 500, 115, 44, 88);
  function findMax() {...} 
  

并不會報錯氓皱。同時JS提供了函數(shù)的內(nèi)置對象arguments，根據(jù)這個可以得到相應(yīng)的參數(shù)

• this的調(diào)用

  var myObject = {
      firstName:"John",
      lastName: "Doe",
      fullName: function () {
      return this.firstName + " " + this.lastName;
      }
  }
  myObject.fullName();         // 返回 "John Doe"
  

• 使用構(gòu)造函數(shù)調(diào)用函數(shù)

  // 構(gòu)造函數(shù):
  function myFunction(arg1, arg2) {
      this.firstName = arg1;
      this.lastName  = arg2;
  }
  // This creates a new object
  var x = new myFunction("John","Doe");
  x.firstName;         //John
  

• JS的Browser對象
  location.hash 設(shè)置或返回從井號 (#) 開始的 URL（錨）
  location.host 設(shè)置或返回主機名和當(dāng)前 URL 的端口號
  location.hostname 設(shè)置或返回當(dāng)前 URL 的主機名
  location.href 設(shè)置或返回完整的 URL
  location.pathname 設(shè)置或返回當(dāng)前 URL 的路徑部分
  location.port 設(shè)置或返回當(dāng)前 URL 的端口號
  location.protocol 設(shè)置或返回當(dāng)前 URL 的協(xié)議
  location.search 設(shè)置或返回從問號 (?) 開始的 URL（查詢部分）
  history.back() 與在瀏覽器點擊后退按鈕相同
  history.forward() 與在瀏覽器中點擊按鈕向前相同
• JavaScript 計時事件
  setInterval("javascript function",milliseconds) - 間隔指定的毫秒數(shù)不停地執(zhí)行指定的代碼。
  setTimeout("javascript function",milliseconds) - 暫停指定的毫秒數(shù)后執(zhí)行指定的代碼
• jQuery選擇器
  • 如果已經(jīng)是jQuery對象了了波材，則往下尋找的時候需要使用find()方法股淡，如$("#phase_mx").find("input[name^='mFlt']")
  • jQuery的模糊匹配包括^=，$=各聘，*=分別對應(yīng)開始、結(jié)束抡医、包含關(guān)系躲因。
• jQuery異步請求
  有三種方式 $.get，$.post忌傻，$.ajax大脉，其中前兩者是后者的簡單方式，如果需要修改一些參數(shù)則要使用$.ajax水孩，

  $.ajax({
      url: "project/import",
      type: "POST",
      async: false,//同步或異步
      data: "test=test",//發(fā)送參數(shù)
      dataType: "json", //返回類型
      beforSend: function() {
      },
      success: function(msg) {
      },
      error: function() {
      }
  })
  

• jQuery獲取文檔內(nèi)容
  jQuery中有text()和html()方法镰矿，和JS的innerTEXT()或innerHTML()類似，并且可以使用回調(diào)函數(shù)

  $(selector).text(function(index,oldcontent))
  

• 元素選擇器
  利用jQuery選擇器選取第幾個元素時俘种，不能直接用[]來選擇秤标，而是要通過eq來進行選擇，如下：

  for (var i = 0; i < $("input[type='text']").length; i++) {
      $("input[type='text'] :eq(" + i + ")").val(i);
  }
  

  而在用dom節(jié)點選擇的時候則可以利用[]來選擇第幾個元素宙刘，如：

  document.getElementsByName('name')[0].value='changdy'
  

  JS和jQuery的不同一定要注意辨別
• JS類型轉(zhuǎn)換
  從input中得到的值默認是字符串類型的苍姜，如果期望是數(shù)字類型比較則有可能得到錯誤判斷。這個時候需要用到類型轉(zhuǎn)換悬包，數(shù)字類型的可以使用parseFloat()和parseInt()方法衙猪。
  另外，JS中也有強制類型轉(zhuǎn)換布近，比如Boolean(value)垫释、Number(value)、String(value)撑瞧。具體可以參考：cnblogs
• jQuery each()方法
  each()方法中的this為dom對象棵譬，而不是jQuery對象，轉(zhuǎn)換方法如$(this)预伺，如果需要查找子對象則可以使用.find()方法
• jQuery 發(fā)送文件
  當(dāng)使用Spring MVC接收的時候茫船，參數(shù)為@Param("fileName") MultipartFile file
• 遍歷Object對象

  var obj = {a:1 , b:2 , c:3}
  for(var s in obj){
    console.log(s);
    console.log(obj[s]);
  }
  

• JS中生成和解析JSON