iT邦幫忙

0

Day 21 (Js)

  • 分享至 

  • xImage
  •  

1.外掛:

Auto Rename Tag
Bracket Pair Colorizer
Chinese (Traditional)
Live Server


2.

HTML:網頁內容 h1
CSS:美化 hover
JavaScript: 互動 => 存取 =>指令
計畫 回應使用者


3.物件Object:萬物皆物件

屬性 + 事件() = 物件Object
標籤 透過 瀏覽器 ==> 變成物件Object


4.小背包()

Method|Function =>函式 副程式 方法
給他小背包才會執行

沒有小背包() 屬性
https://www.w3schools.com/jsref/dom_obj_document.asp


5.BOM、DOM

https://youtu.be/tMmpaR0EnnA?t=32

(1)Browser Object Model (BOM)
https://www.w3schools.com/js/js_window.asp

(2)The HTML DOM (Document Object Model)
DOM樹
https://www.w3schools.com/js/js_htmldom.asp


6.變數的命名:[A-Z][a-z]_[0-9]

https://www.w3schools.com/js/js_syntax.asp

不可以
Hyphens: first-name, last-name, master-card, inter-city.

可以
(1)Underscore:

first_name, last_name, master_card, inter_city.

(2)Upper Camel Case (Pascal Case):
FirstName, LastName, MasterCard, InterCity.

(3)Lower Camel Case:
JavaScript programmers tend to use camel case that starts with a lowercase letter:
firstName, lastName, masterCard, interCity.


7.變數:

(1)倉庫,等一下拿出來用

(2)先宣告變數再使用,不要用了才宣告
雖然宣告會往上放to the top
(Hoisting is JavaScript's default behavior of moving declarations to the top.)
https://www.w3schools.com/js/js_hoisting.asp
但是還是會出錯誤:

      console.log(x4);
      var x4 = 25;

8.字串

(1) (Template Literals):2015後,可以塞${變數},好用

      `字串`
      var temp = "插入文字";
      var msg3 = `在我們的${temp}中間`;
      console.log(msg3); 

(2)''
(3)""


9.var、let、const的差異

先宣告 var、let、const

    var a = 1;
    let b = 2;
    const c = 3;

(1)更改

var、let 可以被更改
const 不能被更改

      a = 11;
      b = 22;
      c = 99; //會錯誤

(2)if判斷句中,作用域範圍

var {}外也不受影響
let {}失效,但這樣才是合理的

      if (1 == 1) {
        var x = "rabbit";
        let y = "bunny";
        console.log(x); //rabbit
        console.log(y); //bunny
      }

      console.log(x); //rabbit
      console.log(y); //失效

(3)宣告相同的變數名稱

var 更新宣告值
let 不能重複宣告

       var cat = 99;
       var cat = 55;
       console.log(cat); //55
       let cat = 99;
       let cat = 55;
       console.log(cat); //Identifier 'cat' has already been declared

(4)宣告往上拉

behavior of moving declarations to the top
var 被往上拉而有反應
let 反正就是錯誤。(ReferenceError: Cannot access 變數名稱 before initialization(???))

var

        x3 = 20;
        console.log(x3);  //20
        var x3; 

        console.log(x4);  //undefined
        var x4 = 25;

let

         y3 = 20;
         console.log(x3);
         let x3;
         console.log(x4);
         let y4 = 25;

(5)if內的var在外面還能用,function則否

         finction aaa(){
         var bbb = 10 //生命週期在finction內
         }

10. match

regexp只是個說明(可以放甚麼? 可以放字串 |或 RegExp 正規表示法)
:RegExpMatchArray回傳甚麼樣的值
https://ithelp.ithome.com.tw/upload/images/20210625/20137684nhDJEbOHnQ.png


11.F12 開發者工具

Console 檢查用
Network 載入時間
Application 暫時性存放資料


12.VS Code 常用快捷鍵:

Ctrl + D => 整體改變
Alt +上下 => 移動
Alt + Shift +上下 => 複製
Alt + Shift 多行選取


我需要的分隔線XD
console.log('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n');


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言