JavaScript 01 (JS引入/變量/數(shù)據(jù)類型/類型轉(zhuǎn)換/Math方法)

JS的引入及調(diào)試,常量,字面量,變量,JS中的數(shù)據(jù)類型,JS的運(yùn)算符,JS的運(yùn)算符之隱式類型轉(zhuǎn)換,強(qiáng)制類型轉(zhuǎn)換,Math的相關(guān)方法,parseInt()和parseFloat()

版權(quán)聲明:本文為博主原創(chuàng)文章荞怒,遵循 CC 4.0 BY-SA 版權(quán)協(xié)議,轉(zhuǎn)載請附上原文出處鏈接和本聲明挤土。

歡迎大家去我的個人技術(shù)博客看看檐束,點(diǎn)贊收藏注冊的都是好人哦~

https://xiaowu.xyz

前言--

JavaScript誕生于1995年。起初它的主要目的是處理以前由服務(wù)器端負(fù)責(zé)的一些表單驗(yàn)證般码。在那個絕大多數(shù)用戶都在使用調(diào)制解調(diào)器上網(wǎng)的時代妻率,用戶填寫完一個表單點(diǎn)擊提交,需要等待幾十秒板祝,完了服務(wù)器反饋給你說某個地方填錯了......在當(dāng)時如果能在客戶端完成一些基本的驗(yàn)證絕對是令人興奮的宫静。當(dāng)時走在技術(shù)革新最前沿的Netscape(網(wǎng)景)公司,決定著手開發(fā)一種客戶端(瀏覽器)語言券时,用來處理這種裝簡單的驗(yàn)證孤里。

**言簡意賅的講**:由于網(wǎng)速的原因,做一個簡單的表單驗(yàn)證橘洞,需要很長時間捌袜,這時頁面會出現(xiàn)空白現(xiàn)象。所以Netscape想開發(fā)一種語言炸枣,在瀏覽器端進(jìn)行驗(yàn)證虏等。(LiveScript)

當(dāng)時就職于Netscape公司的布蘭登·艾奇開始著手計劃將1995年2月發(fā)布的LiveScript同時在瀏覽器和服務(wù)器中使用。為了趕在發(fā)布日期前完成LiveScript的開發(fā)适肠,Netscape與Sun公司成立了一個開發(fā)聯(lián)盟霍衫。而此時,Netscape為了搭上媒體熱炒Java的順風(fēng)車侯养,臨時把LiveScript改名為JavaScript慕淡,所以從本質(zhì)上來說JavaScript和Java沒什么關(guān)系。(為了推廣語言)

JavaScript 是運(yùn)行在客戶端(瀏覽器)的編程語言

JavaScript是一種運(yùn)行在客戶端?的腳本語言?(解釋型語言)

JavaScript的解釋器被稱為JavaScript引擎沸毁,為瀏覽器的一部分峰髓,廣泛用于客戶端的腳本語言,最早是在HTML(標(biāo)準(zhǔn)通用標(biāo)記語言下的一個應(yīng)用)網(wǎng)頁上使用息尺,用來給HTML網(wǎng)頁增加動態(tài)功能携兵。


目錄:

一、JS的引入及調(diào)試

二搂誉、常量徐紧,字面量 ,變量

三、JS中的數(shù)據(jù)類型

四并级、JS的算數(shù)運(yùn)算符

五拂檩、JS的運(yùn)算符之隱式類型轉(zhuǎn)換

六、強(qiáng)制類型轉(zhuǎn)換

七嘲碧、Math的相關(guān)方法?

八稻励、parseInt()和parseFloat()


一、JS的引入及調(diào)試

首先愈涩,JavaScript望抽,以下我們簡稱JS/js,我們需要知道三個問題(吾日三省吾身)履婉,js有什么用煤篙?js是由什么組成?js代碼應(yīng)該寫在什么地方毁腿?

1.1辑奈、js的作用

JavaScript是一種專為與網(wǎng)頁交互而設(shè)計的客戶端腳本語言。

最初是為了實(shí)現(xiàn)表單驗(yàn)證

JavaScript能完成的功能多得去了已烤?

用戶交互(表單驗(yàn)證)

網(wǎng)頁特效(漂浮的廣告)

用戶記住賬戶名密碼

網(wǎng)頁游戲(圍住神經(jīng)貓)

……

1.2身害、js的組成


1.3、js的書寫位置

好了草戈,我知道js是啥了,那么js的代碼我們應(yīng)該寫在哪里侍瑟?

首先唐片,js代碼有兩種寫法,

第一種可以直接把js代碼寫在<script></script>標(biāo)簽里

例如:

<script>alert("我在script標(biāo)簽中哦")</script>

第二種可以在script標(biāo)簽中加上src的屬性涨颜,里面填上外部的js文件费韭,在外部js文件中書寫js代碼

<script src="js/index.js"></script>

注意:這個時候,script雙標(biāo)簽里面的代碼是不會生效的庭瑰。

然后我們看看script標(biāo)簽應(yīng)該寫在什么地方

1.3.1星持、在頁頭(也就是head中)

1.3.2、在頁尾

(body最后或者body閉合標(biāo)簽之外(html閉合標(biāo)簽之內(nèi)))

tip:或者放在</body>和</html之間>

1.3.3弹灭、元素事件中(寫在標(biāo)簽屬性中)

2督暂、關(guān)于js的調(diào)試方法

js有一個問題,如果前面的代碼出現(xiàn)問題穷吮,后面的代碼都不會執(zhí)行逻翁,我們就需要借助一些方法/函數(shù),來測試代碼段是否出現(xiàn)問題捡鱼。

2.1八回、document.write("world?world");

document.write()??在文檔中輸入一段內(nèi)容??document.write()??在()寫你想輸出的內(nèi)容

2.2、console.log("world?world");

console.log("world?world");??//???在控制臺輸出一段內(nèi)容??

2.3、alert();

alert();???彈出框???alert("hello?world");?//??彈出框輸出一段內(nèi)容

2.4缠诅、他們之間的區(qū)別和優(yōu)缺點(diǎn)

1溶浴、document.write()? 會在html的文檔中輸出內(nèi)容,會影響到原本的html頁面的結(jié)構(gòu)管引,根據(jù)代碼的位置不同士败,會在不同位置輸出內(nèi)容,不太可控汉匙。

而且由于閉合的文檔流使用document.write()會覆蓋文檔流拱烁,所以,在事件和異步的操作中噩翠,document.write會重置掉全部頁面中的文檔流戏自,并用write()中的內(nèi)容來替換body中的內(nèi)容。不推薦使用伤锚。

2擅笔、alert() 會在瀏覽器窗口中彈出一個彈出框,alert()會阻塞js屯援,如果alert()放在html標(biāo)簽之前猛们,alert()會導(dǎo)致后面的html頁面阻塞加載,而且alert()數(shù)量過多也會造成一定的閱讀困難狞洋。請少量使用弯淘。

3、console.log() 會在控制臺輸入內(nèi)容 吉懊,不會影響頁面結(jié)構(gòu)庐橙,不會阻塞頁面,也不會造成任何困擾借嗽,強(qiáng)烈推薦使用态鳖。

二、常量/字面量 恶导,變量


1浆竭、常量/直接量( 字面量 literal)

所有直接量(字面量),就是程序中直接顯示出來的數(shù)據(jù)????

? 100;? ? //數(shù)字? ? 的字面量

? "我是文本"? ? ? ? //字符串? 的字面量

? ?true? false? ? ? //布爾? ? 的字面量? ?


2惨寿、變量

變量 (存儲數(shù)據(jù)的容器)

2.1邦泄、變量的定義

變量定義:

var age; //var 是關(guān)鍵字,age是變量名

賦值:

? ? ? age = 20;

定義的同時賦值:

? ? ? var age=20裂垦;

可以一次定義多個變量:

? ? ? var name=“tianyufei", age=18虎韵,weight=108;


注意:變量在聲明后但沒有賦值的時候,系統(tǒng)都會給變量一個默認(rèn)值缸废,為undefined包蓝,類型為undefined驶社。

2.2變量的命名規(guī)范

JS的標(biāo)識符:

標(biāo)識符是指JS中定義的符號,例如:變量名测萎、函數(shù)名等亡电。

標(biāo)識符可以由任意的大小寫字母、數(shù)字硅瞧、下劃線(_)和美元符($)組成份乒,但是不能以數(shù)字開頭,不能是js中的保留字和關(guān)鍵字腕唧。

標(biāo)識符區(qū)分大小寫或辖,如:age和Age是不同的變量。但強(qiáng)烈不建議枣接,用同一個單詞的大小寫區(qū)分兩個變量

什么是JS的關(guān)鍵字和保留字颂暇?

關(guān)鍵字指JS語法中已經(jīng)使用過了的單詞,它們有自己本身的特殊含義但惶。

保留字指的是JS保留下來不允許用戶使用的單詞耳鸯,這些單詞盡管JS目前沒有使用,但是有可能會在之后的版本升級中用上膀曾,所以提前保留下來县爬,而我們的代碼也可能會運(yùn)行很多年,如果使用了這些保留字添谊,就有可能在某一次JS語法更新的時候出現(xiàn)bug财喳。

三、JS中的數(shù)據(jù)類型

String:字符串斩狱;

Number:數(shù)字(整數(shù)耳高,浮點(diǎn)數(shù)float)

Array:數(shù)組

Object:對象

布爾類型:Boolean? a==b

特殊類型 Null、Undefined喊废、NaN(NaN其實(shí)是屬于Number類型的一個特殊值)

? ? ? 如果alert(abc)一個不存在的變量,會直接報錯栗弟,而不是undefined污筷,可見undefined和真正的未定義還是有些區(qū)別的。因?yàn)樗且环N特殊類型乍赫。

null也是一種值瓣蛀,但邏輯含義是沒有值,它是對象Object類型

獲取變量類型的方法:

typeof 變量名;? 返回的是一個對應(yīng)數(shù)據(jù)類型的字符串("number","string")

例如:?

var a= 100;

console.log(typeof a);

JS的number類型的特殊值 NaN(非數(shù)字) Infinity (無限大/無窮大)

四雷厂、JS的算數(shù)運(yùn)算符

算術(shù)運(yùn)算符 (+,-,/,*,%);

整數(shù)的加惋增,減,乘改鲫,除诈皿,和取余就不說了林束,這個小學(xué)的數(shù)學(xué)老師會教。

還有一個優(yōu)先級的問題稽亏,小學(xué)老師應(yīng)該也教了壶冒,先乘除取余,后加減截歉。

注意:%取余后的余數(shù)一定小于除數(shù)胖腾。


? ? //小數(shù)計算 會失精度

? ? 0.1 + 0.2? ?// 0.30000000000000004? ?小數(shù)計算 會失精度

? ? 0.1 + 0.7? ?// 0.7999999999999999

// 解決辦法 toFixed(n)

var result = (0.1 + 0.7).toFixed(4);

console.log(result);

//toFixed(n) 數(shù)字的一個方法 保留n位小數(shù) 得到一個數(shù)字的字符串

五、js算數(shù)運(yùn)算符之隱式類型轉(zhuǎn)換

在Js中瘪松,各個數(shù)據(jù)類型在遇到算數(shù)運(yùn)算符后咸作,都會進(jìn)行隱式的類型轉(zhuǎn)換,這種轉(zhuǎn)換我們是看不到的宵睦, 我們只能看到轉(zhuǎn)換后的結(jié)果记罚。

字符串 遇到 "+" 會 拼接 形成新的字符串(無論字符串在前還是在后)

????// var a = "100"; // string?

? ? // var b = 3;

? ? // var c = a + b;? // "1003"? => 拼接之后會得到字符串

? ? // var c = b + a;? // "3100"

? ? // console.log(c);

? ? // console.log("100" + true); // 100true

? ? // console.log("100" + undefined); // 100undefined

? ? // console.log("100" + null); //100null

? ? // console.log("100" + NaN); //100NaN

字符串 遇到 "-,*,/,%" 會 隱式的轉(zhuǎn)化為數(shù)字("100","123") 并進(jìn)行相應(yīng)的計算,如果不是“數(shù)字”字符串("a","abc","blog","123a")状飞,就會轉(zhuǎn)換為NaN

boolean 值 遇到 算術(shù)運(yùn)算符(+,-,*,/,%) 也會 隱式的轉(zhuǎn)化為 數(shù)字? true => 1 ; false =>0

null 遇到 算術(shù)運(yùn)算符(+,-,*,/,%)? 也會 隱式的轉(zhuǎn)化為? 0

undefined不會隱式的轉(zhuǎn)化為數(shù)字毫胜,會轉(zhuǎn)換為 NaN

? ? var a = "100";

? ? var b = 3;

? ? var c = a % b;

? ? // console.log(c);? ? //? 1

? ? console.log("100" * true); // 100*1? =>100

? ? console.log("100" * undefined); // NaN? ? undefined不會隱式的轉(zhuǎn)化為數(shù)字

? ? console.log("100" * null); // 100 * 0? => 0

? ? console.log("100" * NaN); //NaN


六、強(qiáng)制類型轉(zhuǎn)換

String()?強(qiáng)制把其他類型轉(zhuǎn)化為 string ( 函數(shù)執(zhí)行之后得到 一個對應(yīng)的字符串 )

Number()?強(qiáng)制把其他類型轉(zhuǎn)化為 number 類型

//所有的非數(shù)字轉(zhuǎn)化為數(shù)字 都是NaN(boolean,null,"", => 0);


Boolean() 強(qiáng)制把其他類型轉(zhuǎn)化為 boolean 類型

(0,NaN,"",undefined,null) 轉(zhuǎn)化為boolean值 為false诬辈,凡是有內(nèi)容的轉(zhuǎn)換為boolean都會是true

注意:空格字符串(" ")和空字符串("")不同酵使,空格字符串轉(zhuǎn)換為布爾類型為true;

????var a = 1; // true

? ? var a = 2;? // true

? ? var a = Infinity; // true

? ? // var a = 0;? //false

? ? // var a = NaN; //false

? ? var a = "100a"; //true

? ? var a = " ";? //true? 空格字符串

? ? var a = "";? //false? 空字符串

? ? var a = undefined; //false;

? ? var a = null; //false;

? ? var b = Boolean(a);

? ? console.log(b)


七焙糟、Math的相關(guān)方法?

Math.random() 隨機(jī)一個0-1的隨機(jī)數(shù) [0,1) 注意 取不到 1

var num = Math.random();


Math.ceil(); 向上取整 只要包含小數(shù)就向上進(jìn)1? ? ?(ceil單詞的意思 天花板)

var a = Math.ceil(num);


Math.floor() 向下取整 只要包含小數(shù)舍去 (floor單詞的意思 地板)

?var b = Math.floor(num);


Math.round() 四舍五入 >=0.5 進(jìn) 1 , <0.5 就舍去

var b = Math.round(num);


Math.min(num1,num2,num3,num4); 最小值

var min = Math.min(9, 5, 4, 3, 1, 12, 21);


Math.max(num1,num2,num3,num4); 最大值

var max = Math.max(9, 5, 4, 3, 1, 12, 21);


Math.abs(); 取絕對值

var abs = Math.abs(-10);


Math.pow(m,n) m^n m的n次冪(次方)

var num = Math.pow(2, 10);


Math.PI 3.141592653589793

console.log(Math.PI);


以上的代碼都不會顯示結(jié)果口渔,需要用console.log輸出結(jié)果。


八穿撮、parseInt()和parseFloat()

parseInt() 把其他類型轉(zhuǎn)化為整型(整數(shù)) 把數(shù)據(jù)中 第一個非數(shù)字 之前的數(shù)提取出來 轉(zhuǎn)化為 整數(shù)

parseFloat() 把其他類型轉(zhuǎn)化為浮點(diǎn)型(小數(shù)) 把數(shù)據(jù)中 第一個非數(shù)字 之前的數(shù)提取出來 轉(zhuǎn)化為 number (保留小數(shù))

"300px" * 1 => NaN

?"300px"? =>? 300

parseInt()?

????var a = "300px"; //300

? ? var a = "3a00px"; //3

? ? var a = "b3a00px";//NaN

? ? var a = "300.5px"; // 300

? ?? var b = parseInt(a);

????console.log(b);

parseFloat()

var a = "300.5px";? //300.5

var b = parseFloat(a);

console.log(b);

parseInt也可以用來取整缺脉,可以將一個number類型的數(shù)字進(jìn)行取整,舍棄到后面的小數(shù)位悦穿,用法和Math.floor()相同

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末攻礼,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子栗柒,更是在濱河造成了極大的恐慌礁扮,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,858評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件瞬沦,死亡現(xiàn)場離奇詭異太伊,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)逛钻,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,372評論 3 395
  • 文/潘曉璐 我一進(jìn)店門僚焦,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人曙痘,你說我怎么就攤上這事芳悲×⒅猓” “怎么了?”我有些...
    開封第一講書人閱讀 165,282評論 0 356
  • 文/不壞的土叔 我叫張陵芭概,是天一觀的道長赛不。 經(jīng)常有香客問我,道長罢洲,這世上最難降的妖魔是什么踢故? 我笑而不...
    開封第一講書人閱讀 58,842評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮惹苗,結(jié)果婚禮上殿较,老公的妹妹穿的比我還像新娘。我一直安慰自己桩蓉,他們只是感情好淋纲,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,857評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著院究,像睡著了一般洽瞬。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上业汰,一...
    開封第一講書人閱讀 51,679評論 1 305
  • 那天伙窃,我揣著相機(jī)與錄音,去河邊找鬼样漆。 笑死为障,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的放祟。 我是一名探鬼主播鳍怨,決...
    沈念sama閱讀 40,406評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼跪妥!你這毒婦竟也來了鞋喇?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,311評論 0 276
  • 序言:老撾萬榮一對情侶失蹤眉撵,失蹤者是張志新(化名)和其女友劉穎侦香,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體执桌,經(jīng)...
    沈念sama閱讀 45,767評論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡鄙皇,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,945評論 3 336
  • 正文 我和宋清朗相戀三年芜赌,在試婚紗的時候發(fā)現(xiàn)自己被綠了仰挣。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,090評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡缠沈,死狀恐怖膘壶,靈堂內(nèi)的尸體忽然破棺而出错蝴,到底是詐尸還是另有隱情,我是刑警寧澤颓芭,帶...
    沈念sama閱讀 35,785評論 5 346
  • 正文 年R本政府宣布顷锰,位于F島的核電站,受9級特大地震影響亡问,放射性物質(zhì)發(fā)生泄漏官紫。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,420評論 3 331
  • 文/蒙蒙 一州藕、第九天 我趴在偏房一處隱蔽的房頂上張望束世。 院中可真熱鬧,春花似錦床玻、人聲如沸毁涉。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,988評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽贫堰。三九已至,卻和暖如春待牵,著一層夾襖步出監(jiān)牢的瞬間其屏,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,101評論 1 271
  • 我被黑心中介騙來泰國打工洲敢, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留漫玄,地道東北人。 一個月前我還...
    沈念sama閱讀 48,298評論 3 372
  • 正文 我出身青樓压彭,卻偏偏與公主長得像睦优,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子壮不,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,033評論 2 355

推薦閱讀更多精彩內(nèi)容