JavaScript 網頁前端工程入門:JSON 基本教學 By 彭彭

แชร์
ฝัง
  • เผยแพร่เมื่อ 26 ต.ค. 2016
  • 使用 JSON (JavaScript Object Notation) 格式快速建立物件;在一般物件和 JSON 格式的字串間進行轉換。
    相關概念,JS 物件教學影片: • 網頁前端工程入門:Javascript 物件...
    更多教學內容請參考:training.pada-x.com/

ความคิดเห็น • 47

  • @maskman4821
    @maskman4821 6 ปีที่แล้ว +6

    講解非常清楚,很棒的教學!

  • @bi7253
    @bi7253 2 ปีที่แล้ว

    真的是非常厲害,很清楚,感謝教學

  • @aprillam227
    @aprillam227 7 ปีที่แล้ว +10

    impressive! your teaching is way better than my lecturer! you save my life. thanks!!!

  • @jimmyl9551
    @jimmyl9551 4 ปีที่แล้ว +1

    謝謝老師~講得好清楚

    • @cwpeng-course
      @cwpeng-course  4 ปีที่แล้ว

      不會,也謝謝你的留言 :)

  • @user-om2di3do6u
    @user-om2di3do6u 2 ปีที่แล้ว +1

    謝謝作者的製作。

  • @t19960804
    @t19960804 7 ปีที่แล้ว +5

    感謝教學

  • @user-bk3zt8sp1df
    @user-bk3zt8sp1df หลายเดือนก่อน

    謝謝彭彭老師。
    10:30,物件轉字串,"get":function(){},會被屏蔽掉。
    字串轉物件,"get":function(){},已被屏蔽掉,與原本完全不同。

  • @eastern815
    @eastern815 6 ปีที่แล้ว +1

    good

  • @YuxanShen
    @YuxanShen 2 ปีที่แล้ว +4

    在看Pyton 的時候結果要看Json 所以只能跑過來看惹XDDD

    • @cwpeng-course
      @cwpeng-course  2 ปีที่แล้ว +1

      哈哈哈,好哦,希望這個會有點幫助 :)

  • @Kady-bc1pf
    @Kady-bc1pf 4 ปีที่แล้ว

    想請問今天前端用JSON方式寫完之後想保留想把紀錄儲存起來做成資料庫該該怎麼做?
    回傳後端由後端存成筆記本嗎?((我是剛接觸語言的小菜鳥QQ

    • @cwpeng-course
      @cwpeng-course  4 ปีที่แล้ว

      確實必須把資料傳遞給後端,再由後端的程式負責把資料送進資料庫中 ~

  • @user-hs2gh8fn6k
    @user-hs2gh8fn6k 6 ปีที่แล้ว

    诶,老师请问,打开 JSON 是需要一个其他的软件吗?写好 在游览器上看到到什么……谢谢

    • @cwpeng-course
      @cwpeng-course  6 ปีที่แล้ว +1

      不用哦,JSON就是JavaScript的一部份,要配合其他JavaScript的程式来运作。

  • @user-gb5mw2yw7e
    @user-gb5mw2yw7e 3 ปีที่แล้ว +1

    var jsonStr=JSON.stringify(point);
    //讓point 此JSON轉換為String 字串
    var plainObj=JSON.parse(jsonStr);
    //讓jsonStr再此轉換回JSON物件

  • @user-qf2fm4js1z
    @user-qf2fm4js1z ปีที่แล้ว +1

    Jason格式傳送的, 可稱為太監object, function部分先被閹割了, 然後才能用網路傳送

  • @chouyuchin5518
    @chouyuchin5518 2 ปีที่แล้ว

    老師 請問JSON應用在python時候,可以在JSON裡將演算法的函式寫好,再用python呼叫這個JSON文件嗎?

    • @cwpeng-course
      @cwpeng-course  2 ปีที่แล้ว +2

      不行,JSON 對 Python 而言只是某種資料格式而已 ~

    • @chouyuchin5518
      @chouyuchin5518 2 ปีที่แล้ว +1

      @@cwpeng-course 了解, 看來要變化python的演算法函式就只能靠主程式了 謝謝!

  • @stevenlai4772
    @stevenlai4772 ปีที่แล้ว

    想問一下彭彭老師,我在VS code上寫,打開網頁後,卻沒顯示任何文字,是因為VS code的關係嗎?
    程式碼如下:



    Document

    var point={
    "x":3,
    "y":4,
    "get":function(){
    alert(this.x+","+this.y);
    }
    };
    var jsonStr= JSON.stringify(point);
    console.log(jsonStr);

    var plainObj=JSON.parse(jsonStr);
    console.log(plainObj);
    alert(plainObj.x);

    • @cwpeng-course
      @cwpeng-course  ปีที่แล้ว +1

      程式碼看起來沒什麼問題,確認一下有先做存檔的動作,或者按 F12 打開開發人員工具確認是否有錯誤訊息。

    • @stevenlai4772
      @stevenlai4772 ปีที่แล้ว +2

      @@cwpeng-course 後來好像是我要用相關網址去開啟才能,從D槽開啟就不會顯示QQ,也謝謝彭彭老師您的回覆

    • @cwpeng-course
      @cwpeng-course  ปีที่แล้ว

      @@stevenlai4772 好哦,感謝你的分享,有解決就好 :)

  • @jackjack-kw2zh
    @jackjack-kw2zh 5 ปีที่แล้ว +1

    那轉換過後的不見的"方法"怎麼辦? get()

    • @cwpeng-course
      @cwpeng-course  5 ปีที่แล้ว +1

      通常我們會轉換單純用來表達資料的物件,方法不見就是不見了。
      如果覺得方法是重要的,大概就不能這樣轉換。

  • @LW-ig3zy
    @LW-ig3zy 2 ปีที่แล้ว

    請問老師要如何將java連接資料庫?

    • @cwpeng-course
      @cwpeng-course  2 ปีที่แล้ว +1

      我們這裡教的是 JavaScript 哦,JavaScript 在網頁前端無法直接連接資料庫,必須透過後端的系統來進行。

  • @vitochuang9352
    @vitochuang9352 3 ปีที่แล้ว

    有在外面教授開課嗎?

    • @cwpeng-course
      @cwpeng-course  3 ปีที่แล้ว

      歡迎到我的課程網站看看哦,主要是會在台大有實體課程:training.pada-x.com/

  • @rsmn1709
    @rsmn1709 3 ปีที่แล้ว

    什麼是index of

    • @cwpeng-course
      @cwpeng-course  3 ปีที่แล้ว

      搜尋字串中是否包含某段文字 ~

  • @user-eg2fc6zd1h
    @user-eg2fc6zd1h 7 ปีที่แล้ว +1

    抱歉我是初學者,我想詢問如果今天json是額外一個檔案,我要如何載入json至我的JS或是html,我不確定這樣問對不對,是否有說明白您可以再跟我說嗎?
    反正就是我的資料夾裡面有index.html/scripts.js/style.css/package.json我的json要如何仔入或是載入指哪個檔案裏面,對於json這檔案才會有動作呢?
    先感謝摟^^

    • @cwpeng-course
      @cwpeng-course  7 ปีที่แล้ว

      可能最簡單的方式就是直接在 index.html 的網頁中引用
      但實際上可不可行,能不能解決你的問題,還得看你的 package.json 檔案裡面實際上是怎麼寫的,還有你到底打算在程式中怎麼使用它。

    • @UraSystem
      @UraSystem 5 ปีที่แล้ว

      雖然這片已有一年,大大也過了一年,
      可是我今年9月1日才正式學Javascript,
      由於是自學,不停Google search ,中英日文也找過不少 ,
      因為本身我有1個群組 是大家一起收集景照用,
      大量相片的原因 , 18000張 (5.1GB)
      為了方便找圖, 以及節省容量空間 , 試用了json格式
      如下:
      var imagedata = [
      {"idx": "A0007","urlx": "../photoM/image7.png", "altx": "image7", "classx": "img chair house grass" },
      {"idx": "A0006","urlx": "../photoM/image6.jpg", "altx": "image6", "classx": "img car house tree flower grass" },
      {"idx": "A0005","urlx": "../photoM/image5.jpg", "altx": "image5", "classx": "img car house tree flower"},
      {"idx": "A0004","urlx": "../photoM/image4.jpg", "altx": "image4", "classx": "img car tree" },
      {"idx": "A0003","urlx": "../photoM/image3.jpg", "altx": "image3", "classx": "img chair tree flower grass"},
      {"idx": "A0002","urlx": "../photoM/image2.png", "altx": "image2", "classx": "img chair house flower"},
      {"idx": "A0001","urlx": "../photoM/image1.jpg", "altx": "image1", "classx": "img car flower" },
      {"idx": "A0000","urlx": "../photoM/image0.jpg", "altx": "image0", "classx": "img chair car house tree flower grass" }
      ];
      ---------
      那我想問的是, 我如何可以在Json 的 classx 中符合項目(例如我要car 圖) ,來得出符合的idx 呢?