整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          你可曾見過如此簡單粗暴的JavaScript解說-js腳本運行機制

          先,上幾道我編寫的 js 題,作為分析的樣本。

          請根據代碼,選擇正確的選項。

          第一題

          var a = 0;
          function test(){
           alert(a);
          }
          test();
          

          A. 0

          B. null

          C. undefined

          第二題

          var a = 0;
          function test(){
           alert(a);
           a = 100;
          }
          test();
          

          A. 0

          B. null

          C. undefined

          第三題

          var a = 0;
          function test(){
           alert(a);
           var a = 100;
          }
          test();
          

          A. 0

          B. 100

          C. undefined

          正確答案:

          A , A , C

          前兩題沒啥好說的,之前關于閉包的博文中已經講得很清楚了,函數 test 形成了自己的閉包,所以能夠訪問到全局作用域里面的變量 a 。

          第三題可能有人會覺得有點奇怪,為啥是 undefined 的呢?雖然我在閉包內定義了 var a = 100 , 可是它分明是在 alert 語句的下面啊,所以不是應該先打印出全局作用域里的 a 嗎?

          不要著急,我們來講一個故事吧,當你將這段代碼放進瀏覽器跑起來的那一個瞬間,到底發生了哪些有趣的事情。

          當你刷新瀏覽器之后。。。

          0.00000001 毫秒的時候

          Paste_Image.png

          編譯器看到了這句話,

          var a = 0;
          

          編譯器 : ‘nice,發現一個活的 a 變量,我要把它丟到作用域中去囚禁它!

          于是

          0.00000002 毫秒的時候

          編譯器 : nice,發現一個活的 test 變量,我擦,還是一個函數類型,作用域,又有新貨了!

          作用域 : ‘可以呀,小伙子!’

          于是:

          編譯器順便把 test 函數給“扒”了,又發現里面有這么一句話:

          var a = 100;
          

          編譯器:小樣,別以為你躲在 test 函數的私有作用域里面我就找不到你了,全局作用域中的a和你沒關系,你也進去!

          編譯器:嗯,沒找到什么變量定義了,好,我去休息啦。

          0.00000003 毫秒的時候

          js引擎:終于輪到我出場了。

          var a = 0;
          

          a(全局): js引擎大哥,給我吃飯吧 。。。

          js引擎: 吵啥子吵,先給你個undefined,吃這個吧 。

          于是:

          a(全局):只要心中有夢想,undefined也是嚼勁十足!

          js引擎: 等號右邊有一個 0 ,我把它給你吧。

          a(全局):謝謝引擎大哥。

          同樣的,test 變量 也吃上了飯。

          a(局部) : 大哥,我別這么偏袒全局作用域啊,同樣是 a 變量,我也要吃飯啊!

          js引擎:你在函數內部,我還沒執行函數呢,怎么給你吃飯呀,先給你個undefined吧。

          a(局部) :可是我旁邊有一個100啊。

          js引擎:我剛才不是說了嗎,我還沒執行你呢,別挑了,有個undefined啃啃也不錯了。

          0.00000004 毫秒的時候

          test();
          

          js引擎:我要開始執行test函數了。

          alert(a);
          

          js引擎:作用域在嗎,我知道alert是一個內置函數,當我在執行它的時候,發現有一個a變量作為參數傳進去了,你見過它么?

          作用域:有啊,就那個剛才還吵著要吃飯的家伙。

          js引擎:哦,我想起來了,現在它估計還在啃undefined呢,行吧,你把它給我吧,alert方法點名要找他呢。

          作用域:OK。

          故事到這里就講完了,現在你應該明白為什么第三題的答案是undefined了吧。

          附加題:

          var a = 0;
          function test(){
           alert(a);
           if(false){
           var a = 100;
           }
          }
          test();
          

          A. 0

          B. 100

          C. undefined

          別猶豫,大聲說出你的答案吧!

          可以將答案寫在評論中哦!

          avaScript 是網景(Netscape)公司開發的一種基于客戶端瀏覽器、面向(基于)對象、事件驅動式的網頁腳本語言。JavaScript語言的前身叫作Livescript。

          JavaScript的特點:

          • 簡單、易學、易用;
          • 跨平臺;IE、Navigator
          • 符合ECMA(歐洲計算機制造協會)標準,可移植;
          • 事件驅動式的腳本程序設計思想;
          • 動態、交互式的操作方式。

          JavaScript的作用:

          • 交互式操作;
          • 表單驗證;
          • 網頁特效;
          • Web游戲
          • 服務器腳本開發等。

          JavaScript的編寫環境:

          文本編輯器

          JavaScript的執行平臺:

          Web瀏覽器

          JavaScript的執行方式:

          解釋執行(由上而下)

          JavaScript的版本:

          JavaScript1.0——JavaScript1.4

          瀏覽器對JavaScript的支持:

          JavaScript/IE3.0、JavaScript1.2/IE4.0;

          微軟允許用戶自行設置對JavaScript處理模式。

          JavaScript與Java、VBScript、JScript的關系:

          JavaScript與Java的區別體現在:

          首先,它們是兩個公司開發的不同的兩個產品,Java是SUN公司推出的新一代面向對象的程序設計語言,特別適合于Internet應用程序開發;而JavaScript是Netscape公司的產品,其目的是為了擴展Netscape Navigator功能而開發的一種可以嵌入Web頁面中的基于對象和事件驅動的解釋性語言。

          其次,JavaScript是基于對象的,而Java是面向對象的,即Java是一種真正的面向對象的語言,即使是開發簡單的程序,必須設計對象。JavaScript是種腳本語言,它可以用來制作與網絡無關的,與用戶交互作用的復雜軟件。它是一種基于對象和事件驅動的編程語言。因而它本身提供了非常豐富的內部對象供設計人員使用。

          第三,兩種語言在其瀏覽器中所執行的方式不一樣。Java的源代碼在傳遞到客戶端執行之前,必須經過編譯,因而客戶端上必須具有相應平臺上的仿真器或解釋器,它可以通過編譯器或解釋器實現獨立于某個特定的平臺編譯代碼的束縛。JavaScript是一種解釋性編程語言,其源代碼在發往客戶端執行之前不需經過編譯,而是將文本格式的字符代碼發送給客戶,由瀏覽器解釋執行。

          第四,兩種語言所采取的變量是不一樣的。Java采用強類型變量檢查,即所有變量在編譯之前必須作聲明。JavaScript中變量聲明,采用其弱類型。即變量在使用前不需作聲明,而是解釋器在運行時檢查其數據類型。

          第五,代碼格式不一樣。Java是一種與HTML無關的格式,必須通過像HTML中引用外媒體那么進行裝載,其代碼以字節代碼的形式保存在獨立的文檔中。JavaScript的代碼是一種文本字符格式,可以直接嵌入HTML文檔中,并且可動態裝載。編寫HTML文檔就像編輯文本文件一樣方便。

          第六,嵌入方式不一樣。在HTML文檔中,兩種編程語言的標識不同,JavaScript使用<script>...</script>來標識,而Java使用<applet> ... </applet> 來標識。

          第七,靜態綁定和動態綁定。Java采用靜態聯編,即Java的對象引用必須在編譯時的進行,以使編譯器能夠實現強類型檢查,如不經編譯則就無法實現對象引用的檢查。JavaScript采用動態聯編,即JavaScript的對象引用在運行時進行檢查。

          JavaScript學習教程

          如果想要更高效、更系統地學會javascript,最好采用邊學邊練的學習模式。


          今天分享的這套JavaScript學習教程,講解了前端開發中的核心技術JavaScript,俗稱JS

          內容涵蓋:JavaScript核心語法、JavaScript內置支持類、JavaScript調試、JavaScript DOM編程、JavaScript BOM編程、大量前端小案例、JavaScript事件處理、JavaScript對象、繼承、JSON等知識點,該視頻可以開啟你的WEB前端之路。

          課程目錄

          1. .JavaScript教程-JavaScript概述

          2. .JavaScript教程-HTML嵌入JavaScript代碼的第一種方式1

          3. .JavaScript教程-HTML嵌入JavaScript代碼的第一種方式2

          4. .JavaScript教程-HTML嵌入JavaScript代碼的第二種方式

          5. .JavaScript教程-HTML嵌入JavaScript代碼的第三種方式

          6. JavaScript教程-JS的標識符

          7. .JavaScript教程-JS的變量1

          8. .JavaScript教程-JS的變量2

          9. JavaScript教程-JS的函數初步1

          10. .JavaScript教程-JS的函數初步2

          11. .JavaScript教程-全局變量和局部變量

          12. .JavaScript教程-JS的數據類型

          13. .JavaScript教程-Undefined數據類型

          14. .JavaScript教程-Number數據類型

          15. .JavaScript教程-Boolean數據類型

          16. .JavaScript教程-回顧數據類型

          17. .JavaScript教程-String數據類型

          18. .JavaScript教程-Object數據類型

          19. JavaScript教程-Object數據類型2

          20. .JavaScript教程-Object數據類型3

          21. .JavaScript教程-null undefined NaN的區別以及等同和全等運算符

          22. .JavaScript教程-JS的常用事件

          23. .JavaScript教程-回調函數的概念

          24. .JavaScript教程-注冊事件的兩種方式

          25. JavaScript教程-JS代碼的執行順序

          26. .JavaScript教程-JS代碼的執行順序2

          27. JavaScript教程-捕捉回車鍵

          28. .JavaScript教程-捕捉回車鍵2

          29. .JavaScript教程-void運算符

          30. .JavaScript教程-JS的控制語句

          31. JavaScript教程-設置和獲取文本框的value

          32. JavaScript教程-innerHTML和innerText屬性

          33. .JavaScript教程-正則表達式

          34. .JavaScript教程-郵箱地址的正則表達式

          35. JavaScript教程-擴展字符串的trim函數

          36. .JavaScript教程-回顧JS

          37. JavaScript教程-表單驗證

          38. JavaScript教程-表單驗證2

          39. JavaScript教程-表單驗證3

          40. .JavaScript教程-表單驗證4

          41. .JavaScript教程-復選框的全選和取消全選

          42. .JavaScript教程-獲取下拉列表選中項的value

          43. .JavaScript教程-周期函數setInterval

          44. .JavaScript教程-內置支持類Array

          45. .JavaScript教程-BOM編程window的open和close

          46. .JavaScript教程-BOM編程彈出確認框

          47. .JavaScript教程-(補錄)-將當前窗口設置為頂級窗口

          48. .JavaScript教程-BOM編程history和location對象

          49. .JavaScript教程-JSON在開發中的使用

          50. .JavaScript教程-JSON在開發中的使用2

          51. JavaScript教程-JSON在開發中的使用3

          52. .JavaScript教程-JSON在開發中的使用4

          53. JavaScript教程-JSON在開發中的使用5

          更多Java學習資料,獲取方式:

          關注+轉發本文后私信扣“1”

          日常工作總會遇到在<a>標簽中執行js代碼的情況 現在做一個總結,希望對大家有一個幫助。

          1、a href="javascript:js_method();"

          這是我們平臺上常用的方法,但是這種方法在傳遞this等參數的時候很容易出問題,而且javascript:協議作為a的href屬性的時候不僅會導致不必要的觸發window.onbeforeunload事件,在IE里面更會使gif動畫圖片停止播放。

          W3C標準不推薦在href里面執行javascript語句。

          2、a href="javascript:void(0);" onclick="js_method()"

          這種方法是很多網站最常用的方法,也是最周全的方法,onclick方法負責執行js函數,而void是一個操作符,void(0)返回undefined,地址不發生跳轉。而且這種方法不會像第一種方法一樣直接將js方法暴露在瀏覽器的狀態欄。

          3、a href="javascript:;" onclick="js_method()"

          這種方法也是網上很常見的代碼,#是標簽內置的一個方法,代表top的作用。所以用這種方法點擊后網頁后返回到頁面的最頂端。<a href="#"></a> 如果頁面有滾動條 點擊后網頁后返回到頁面的最頂端。

          4、a href="#" onclick="js_method();return false;"

          這種方法點擊執行了js函數后return false,頁面不發生跳轉,執行后還是在頁面的當前位置。


          主站蜘蛛池模板: 亚洲AV网一区二区三区| 午夜视频一区二区三区| 夜夜精品无码一区二区三区| 国偷自产一区二区免费视频| 国产肥熟女视频一区二区三区| 日本人真淫视频一区二区三区| 国产一区二区三区手机在线观看| 无码少妇一区二区三区浪潮AV| 中文字幕色AV一区二区三区| 日本精品一区二区久久久| 国产主播福利精品一区二区| 麻豆文化传媒精品一区二区 | 无码人妻一区二区三区av| 99久久无码一区人妻a黑| 国产福利日本一区二区三区| 最新中文字幕一区| 亚洲第一区精品观看| 成人区精品一区二区不卡 | 一区二区三区杨幂在线观看| 乱色熟女综合一区二区三区| 中文字幕精品亚洲无线码一区 | 日韩人妻无码一区二区三区| 亚洲国产精品综合一区在线| 日韩一区二区免费视频| 亚洲国产一区二区视频网站| 国产高清一区二区三区| 亚洲大尺度无码无码专线一区 | 香蕉久久av一区二区三区| 中文乱码人妻系列一区二区| 色视频综合无码一区二区三区| 无码一区二区三区老色鬼| 精品国产一区二区三区av片 | 偷拍激情视频一区二区三区| 国产在线精品一区二区不卡| 波多野结衣高清一区二区三区| 国模吧一区二区三区| 亚洲一区二区三区在线播放| 精品一区二区无码AV| 国产一区二区三区播放| 国产成人AV区一区二区三| 天海翼一区二区三区高清视频|