JavaScript學習筆記(一)——數據類型和變數

来源:http://www.cnblogs.com/whucs2012/archive/2017/11/19/7850285.html
-Advertisement-
Play Games

在學習廖雪峰前輩的JavaScript教程中,遇到了一些需要註意的點,因此作為學習筆記列出來,提醒自己註意! 如果大家有需要,歡迎訪問前輩的博客https://www.liaoxuefeng.com/學習。 比較運算符 當我們對Number作比較時,可以通過比較運算符得到一個布爾值,這是我們預期的結 ...


在學習廖雪峰前輩的JavaScript教程中,遇到了一些需要註意的點,因此作為學習筆記列出來,提醒自己註意!

如果大家有需要,歡迎訪問前輩的博客https://www.liaoxuefeng.com/學習。


比較運算符

當我們對Number作比較時,可以通過比較運算符得到一個布爾值,這是我們預期的結果:

2 > 5; // false
5 >= 2; // true
7 == 7; // true

實際上,JavaScript允許對任意數據類型做比較:

false == 0; // true
false === 0; // false

要特別註意相等運算符==JavaScript在設計時,有兩種比較運算符

第一種是==比較,它會自動轉換數據類型再比較,很多時候,會得到非常詭異的結果;

第二種是===比較,它不會自動轉換數據類型,如果數據類型不一致,返回false,如果一致,再比較。

由於JavaScript這個設計缺陷,不要使用==比較,始終堅持使用===比較

另一個例外是NaN這個特殊的Number與所有其他值都不相等,包括它自己:

NaN === NaN; // false

唯一能判斷NaN的方法是通過isNaN()函數:

isNaN(NaN); // true

最後要註意浮點數的相等比較:

1 / 3 === (1 - 2 / 3); // false

這不是JavaScript的設計缺陷。浮點數在運算過程中會產生誤差,因為電腦無法精確表示無限迴圈小數。要比較兩個浮點數是否相等,只能計算它們之差的絕對值,看是否小於某個閾值:

Math.abs(1 / 3 - (1 - 2 / 3)) < 0.0000001; // true

null和undefined

null表示一個“空”的值,它和0以及空字元串''不同,0是一個數值,''表示長度為0的字元串,而null表示“空”。

在其他語言中,也有類似JavaScript的null的表示,例如Java也用null,Swift用nil,Python用None表示。但是,在JavaScript中,還有一個和null類似的undefined,它表示“未定義”。

JavaScript的設計者希望用null表示一個空的值,而undefined表示值未定義。事實證明,這並沒有什麼卵用,區分兩者的意義不大。大多數情況下,我們都應該用nullundefined僅僅在判斷函數參數是否傳遞的情況下有用。

數組

數組是一組按順序排列的集合,集合的每個值稱為元素。JavaScript的數組可以包括任意數據類型。例如:

[1, 2, 3.14, 'Hello', null, true];

上述數組包含6個元素。數組用[]表示,元素之間用,分隔。

另一種創建數組的方法是通過Array()函數實現:

new Array(1, 2, 3); // 創建了數組[1, 2, 3]

然而,出於代碼的可讀性考慮,強烈建議直接使用[]

數組的元素可以通過索引來訪問。請註意,索引的起始值為0

var arr = [1, 2, 3.14, 'Hello', null, true];
arr[0]; // 返回索引為0的元素,即1
arr[5]; // 返回索引為5的元素,即true
arr[6]; // 索引超出了範圍,返回undefined

對象

JavaScript的對象是一組由鍵-值組成的無序集合,例如:

var person = {
    name: 'Bob',
    age: 20,
    tags: ['js', 'web', 'mobile'],
    city: 'Beijing',
    hasCar: true,
    zipcode: null
};

JavaScript對象的鍵都是字元串類型,值可以是任意數據類型。上述person對象一共定義了6個鍵值對,其中每個鍵又稱為對象的屬性,例如,personname屬性為'Bob'zipcode屬性為null

要獲取一個對象的屬性,我們用對象變數.屬性名的方式:

person.name; // 'Bob'
person.zipcode; // null

變數

變數的概念基本上和初中代數的方程變數是一致的,只是在電腦程式中,變數不僅可以是數字,還可以是任意數據類型。

變數在JavaScript中就是用一個變數名錶示,變數名是大小寫英文、數字、$_的組合,且不能用數字開頭。變數名也不能是JavaScript的關鍵字,如ifwhile等。申明一個變數用var語句,比如:

var a; // 申明瞭變數a,此時a的值為undefined
var $b = 1; // 申明瞭變數$b,同時給$b賦值,此時$b的值為1
var s_007 = '007'; // s_007是一個字元串
var Answer = true; // Answer是一個布爾值true
var t = null; // t的值是null

變數名也可以用中文,但是,請不要給自己找麻煩。

在JavaScript中,使用等號=對變數進行賦值。可以把任意數據類型賦值給變數,同一個變數可以反覆賦值,而且可以是不同類型的變數,但是要註意只能用var申明一次,例如:

var a = 123; // a的值是整數123
a = 'ABC'; // a變為字元串

這種變數本身類型不固定的語言稱之為動態語言,與之對應的是靜態語言。靜態語言在定義變數時必須指定變數類型,如果賦值的時候類型不匹配,就會報錯。例如Java是靜態語言,賦值語句如下:

int a = 123; // a是整數類型變數,類型用int申明
a = "ABC"; // 錯誤:不能把字元串賦給整型變數

和靜態語言相比,動態語言更靈活,就是這個原因。

請不要把賦值語句的等號等同於數學的等號。比如下麵的代碼:

var x = 10;
x = x + 2;

 

如果從數學上理解x = x + 2那無論如何是不成立的,在程式中,賦值語句先計算右側的表達式x + 2,得到結果12,再賦給變數x。由於x之前的值是10,重新賦值後,x的值變成12

要顯示變數的內容,可以用console.log(x),打開Chrome的控制台就可以看到結果。

使用console.log()代替alert()的好處是可以避免彈出煩人的對話框。

strict模式

JavaScript在設計之初,為了方便初學者學習,並不強制要求用var申明變數。這個設計錯誤帶來了嚴重的後果:如果一個變數沒有通過var申明就被使用,那麼該變數就自動被申明為全局變數:

i = 10; // i現在是全局變數

在同一個頁面的不同的JavaScript文件中,如果都不用var申明,恰好都使用了變數i,將造成變數i互相影響,產生難以調試的錯誤結果。

使用var申明的變數則不是全局變數,它的範圍被限制在該變數被申明的函數體內(函數的概念將稍後講解),同名變數在不同的函數體內互不衝突。

為了修補JavaScript這一嚴重設計缺陷,ECMA在後續規範中推出了strict模式,在strict模式下運行的JavaScript代碼,強制通過var申明變數,未使用var申明變數就使用的,將導致運行錯誤。

啟用strict模式的方法是在JavaScript代碼的第一行寫上:

'use strict';

這是一個字元串,不支持strict模式的瀏覽器會把它當做一個字元串語句執行,支持strict模式的瀏覽器將開啟strict模式運行JavaScript。

來測試一下你的瀏覽器是否能支持strict模式:

'use strict';
// 如果瀏覽器支持strict模式,
// 下麵的代碼將報ReferenceError錯誤:
abc = 'Hello, world';
console.log(abc);

運行代碼,如果瀏覽器報錯,請修複後再運行。如果瀏覽器不報錯,說明你的瀏覽器太古老了,需要儘快升級。

不用var申明的變數會被視為全局變數,為了避免這一缺陷,所有的JavaScript代碼都應該使用strict模式。我們在後面編寫的JavaScript代碼將全部採用strict模式。


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 產品或者服務由數據存儲和數據計算組成。pojo對象就是用於數據存儲。一旦確定後,整個應用或者產品的數據來源就確定。比如一個頁面或者功能需要使用什麼數據就可以快速找到對應的對象或者通過對象的關係找出來。 pojo對象屬於對系統的靜態描述。它應該是名詞,不應該是動詞或者其他。動詞、類型或者狀態等應該是算 ...
  • 前言 我們一般在做架構設計的時候,會經歷過三個階段:需求分析、概要設計和詳細設計。 1. 需求分析階段 : 主要梳理所有用例(Use case)和場景,並抽象出面向系統的用戶與角色,梳理出需求提供哪些功能與非功能的需求給這些用戶。 2. 概要設計階段 :根據需求分析的產物:核心需求,對整個系統進行模 ...
  • 閑話多說 免費報名:http://www.genshuixue.com/teacher/classCourseDetail/171117794648 .Net Core來了,帶給我們的是什麼?跨平臺,無疑是最大的亮點! Docker橫空出世,讓開發者和運維者都嘗到了甜頭! Jenkins持續集成,功 ...
  • 卑鄙是卑鄙者的通行證,高尚是高尚者的墓誌銘。 ——北島《回答》 看北島就是從這兩句詩開始的,高尚者已死,只剩卑鄙者在世間橫行。 本文為讀 lodash 源碼的第一篇,後續文章會更新到這個倉庫中,歡迎 star: "pocket lodash" gitbook也會同步倉庫的更新,gitbook地址: ...
  • 單行overflow: hidden;text-overflow: ellipsis;white-space: nowrap; 多行(相容各個瀏覽器)//通過覆蓋最後幾個字的形式p{ position:relative; line-height:1.4em; height:4.2em;/* 3 倍l ...
  • 蒼蒼之天不得久視,堂堂之地不得久履 當你小心翼翼的開啟服務端渲染的同時,一個問題不得不註意,使用記憶體模式去保存渲染過的頁面,這樣服務斷掉重啟後,緩存也沒有了,所以這裡我們使用mongdodb進行本地化存儲 讀在最前面: 1、本文主題:使用mongodb 進行 預渲染的本地化緩存服務 2、主機環境為W ...
  • 一,在項目中引入jquery-easyui 二,靜態資源映射 1)<mvc:resources mapping="/jquery-easyui-1.5.2/**" location="/easyui/" /> 三,頁面配置 1)在head中引入: <link rel="stylesheet" typ ...
  • 一,下載地址:http://ueditor.baidu.com/website/download.html 1)根據需要下載相應版本 例 Java:選擇jsp+utf-8; 二,放置在項目中 1)解壓下載文件,並重命名為editor; 2)複製文件放置在項目webapp目錄下; 3)把editor目 ...
一周排行
    -Advertisement-
    Play Games
  • 示例項目結構 在 Visual Studio 中創建一個 WinForms 應用程式後,項目結構如下所示: MyWinFormsApp/ │ ├───Properties/ │ └───Settings.settings │ ├───bin/ │ ├───Debug/ │ └───Release/ ...
  • [STAThread] 特性用於需要與 COM 組件交互的應用程式,尤其是依賴單線程模型(如 Windows Forms 應用程式)的組件。在 STA 模式下,線程擁有自己的消息迴圈,這對於處理用戶界面和某些 COM 組件是必要的。 [STAThread] static void Main(stri ...
  • 在WinForm中使用全局異常捕獲處理 在WinForm應用程式中,全局異常捕獲是確保程式穩定性的關鍵。通過在Program類的Main方法中設置全局異常處理,可以有效地捕獲並處理未預見的異常,從而避免程式崩潰。 註冊全局異常事件 [STAThread] static void Main() { / ...
  • 前言 給大家推薦一款開源的 Winform 控制項庫,可以幫助我們開發更加美觀、漂亮的 WinForm 界面。 項目介紹 SunnyUI.NET 是一個基於 .NET Framework 4.0+、.NET 6、.NET 7 和 .NET 8 的 WinForm 開源控制項庫,同時也提供了工具類庫、擴展 ...
  • 說明 該文章是屬於OverallAuth2.0系列文章,每周更新一篇該系列文章(從0到1完成系統開發)。 該系統文章,我會儘量說的非常詳細,做到不管新手、老手都能看懂。 說明:OverallAuth2.0 是一個簡單、易懂、功能強大的許可權+可視化流程管理系統。 有興趣的朋友,請關註我吧(*^▽^*) ...
  • 一、下載安裝 1.下載git 必須先下載並安裝git,再TortoiseGit下載安裝 git安裝參考教程:https://blog.csdn.net/mukes/article/details/115693833 2.TortoiseGit下載與安裝 TortoiseGit,Git客戶端,32/6 ...
  • 前言 在項目開發過程中,理解數據結構和演算法如同掌握蓋房子的秘訣。演算法不僅能幫助我們編寫高效、優質的代碼,還能解決項目中遇到的各種難題。 給大家推薦一個支持C#的開源免費、新手友好的數據結構與演算法入門教程:Hello演算法。 項目介紹 《Hello Algo》是一本開源免費、新手友好的數據結構與演算法入門 ...
  • 1.生成單個Proto.bat內容 @rem Copyright 2016, Google Inc. @rem All rights reserved. @rem @rem Redistribution and use in source and binary forms, with or with ...
  • 一:背景 1. 講故事 前段時間有位朋友找到我,說他的窗體程式在客戶這邊出現了卡死,讓我幫忙看下怎麼回事?dump也生成了,既然有dump了那就上 windbg 分析吧。 二:WinDbg 分析 1. 為什麼會卡死 窗體程式的卡死,入口門檻很低,後續往下分析就不一定了,不管怎麼說先用 !clrsta ...
  • 前言 人工智慧時代,人臉識別技術已成為安全驗證、身份識別和用戶交互的關鍵工具。 給大家推薦一款.NET 開源提供了強大的人臉識別 API,工具不僅易於集成,還具備高效處理能力。 本文將介紹一款如何利用這些API,為我們的項目添加智能識別的亮點。 項目介紹 GitHub 上擁有 1.2k 星標的 C# ...