js基礎-API-2

js組成部分:
1、ECMAscript 核心語法
2钾埂、DOM
3、BOM
js書寫方式:
1科平、行內
2勃教、外聯 、在head標簽或在body標簽中使用script標簽匠抗,<script scr="路徑"></script>
優(yōu)點:徹底和html分離,便于后期維護
js輸出內容方式:
1污抬、alert
2汞贸、document.write
3、prompt
4印机、console.log
注釋: 單行注釋// 多行注釋 /**/

代碼的執(zhí)行順序:
從左到右矢腻、從上到下

數據類型
number 數值
String 單引號、雙引號 字符串和任何相加時都是字符串
unll 空
undefined 用var創(chuàng)建變量沒有賦值時會出現undefined
boolean true flase
引用數據類型:
數組 -Array
日期 - Date
對象 - Object
轉義符:
'把單引號變成普通字符
"把雙引號變成普通字符

字符串 拼接符(連接符) +

調試:
步驟一:在谷歌瀏覽器中鼠標右鍵射赛,選擇檢查多柑,打開開發(fā)者面板,選中soruces項楣责,打開并顯示我們的源代碼
步驟二:在指定js代碼處對應的行號單擊設置斷點
步驟三:刷新點擊下一步手動控制代碼的執(zhí)行過程竣灌。
變量
var
cons
let

變量的命名規(guī)范:規(guī)則:(法律)
變量名可以由數字、字母秆麸、下劃線_初嘹、$符組成、到不能藝術字開頭
不能使用關鍵字或保留字當作變量名沮趣。
變量名區(qū)分大小
規(guī)范(道德)
駝峰命名法屯烦,變量名若由多個單詞組成,第一個單詞首字母要小寫房铭,后面其它首字母要大寫

檢測:typeOf驻龟、indexOf

運算符

加+、減-缸匪、乘*翁狐、除/、取余%
賦值 =豪嗽、等于==谴蔑、全等===
加等于+=豌骏、減等于-=、*=隐锭、/=窃躲、
%=、<钦睡、>蒂窒、<=、>=荞怒、不全等!==

運算符的優(yōu)先級:
1. () 小括號
2. ++洒琢、--、! 一元運算符
3. +褐桌、-衰抑、、/荧嵌、% 算術運算符 先乘除取余數再加減
4. >呛踊、 <、 >=啦撮、 <=谭网、 ==、 !=赃春、 ===愉择、 !==、 比較運算符(關系運算符)
5. &&织中、 || 邏輯運算符锥涕, 先&&后||
6. =、 +=抠璃、-=站楚、
=、/=搏嗡、%=

==和===區(qū)別:等于是比較值窿春,全等是比較的值和類型

轉義符
拼接 +

表示方式 十進制 、 小數采盒、NAN旧乞、isNAN(檢測)

一元運算符:
運算符僅僅運算一種數據【自增、自減磅氨、取反】

二元運算符:
運算符可以運算兩種數據【算術尺栖、比較、邏輯】

邏輯運算符:
且運算$$ 規(guī)則:兩邊條件都符合時候(true),最終結果就是true烦租,否則是false
或運算|| 規(guī)則:連邊條件符合一個就是true延赌、兩邊都不符合就是false
取反除盏! 規(guī)則:就是取反
返回布爾值

自增
自減
var a = 10;
var sum = ++a + a++;
// a = a+1; a=11;
// sum = 11+a++
// sum = 11 + 11;//22
// a= a + 1; a = 12

數據類型轉換
轉字符串 string() undefinde和null 不能調用string
轉數字 Number()
隱式轉換:
string:任何數據和字符串相加都會自動轉換為string類型
Number:任何數據在做算術運算時(除了和字符串相加外),或任何數據在
在和數據比較時挫以,其他運算都會自動轉換Number
NAN:任何數據和NaN做算術運算時者蠕,都是NaN, NaN==NaN(false)
boolean:- 在取反運算時掐松,其他數據會自動轉換為布爾值
在分支結構或循環(huán)結構的條件判斷中踱侣,其他數據會自動轉換成布爾值(后續(xù)演示...)

順序結構:
從左到右,從上到下
分支結構:
if大磺、else 抡句、else if else
switch case: break; default

三元表達式:hours = hours<10?'0'+hour:hour;

循環(huán)結構
while() do()while() for()

強制轉換字符串:
方式1 tostring()
undefined 和null不能調用toString()
方式2 string();
強制轉數字:
字符串數值轉數字
方式1 Number('')
非字符串數字轉數字
方式2 Number('abc') //NaN
布爾值轉數字
Number(true) //1
Number(false) //0
Undefined和NULL轉數字
Number(undefined) //NaN
Number(null) //0
轉換布爾值:
方式:Boolean(其他數據)
console.log( Boolean('') );
console.log( Boolean(0) );
console.log( Boolean(undefined) );
console.log( Boolean(NaN) );
console.log( Boolean(null) );
轉為整數:只顯示整數 若前面是數值,后面是字母杠愧,那么只會提取前面的數值
parseInt

轉為小數:會顯示小數
parseFloat ()

任何數據和字符串[相加]都會自動轉換為String類型待榔。
var age = '5' + 100; // '5' + '100'
console.log(age);

隱式轉換 ---- 會 布爾值 取反 或 $$

while(條件表達式) 和for循環(huán)很相似:1、先定義變量流济、2究抓、條件、3袭灯、count++
先滿足條件在執(zhí)行
count++
do-while{}(條件表達式)
不管條件是否滿足,至少執(zhí)行一次
for
針對循環(huán)次數確定時绑嘹,可以用for循環(huán)稽荧;
break
由于它是用來退出循環(huán)或者swicth語句,所以只有它出現這些語句工腋,這種形式break語句才是合法的姨丈。
是立即結束語句,并從頭執(zhí)行該語句
continue
continue語句只能用在while語句擅腰、do/while語句蟋恬、for語句或者for/in語句的循環(huán)
體內的,在其它地方都會報錯
結束當前循環(huán)趁冈,進入下個循環(huán)
循環(huán)結構
for歼争、while、do while
解決循環(huán)渗勘,for死循環(huán)沐绒,次確定時候用for循環(huán),加加也可以減減的
關鍵字:
break 跳出整個循環(huán)
continue 跳出這個給循環(huán)旺坠,循環(huán)下次循環(huán)

數組:
索引是有序的乔遮、從0開始
數組長度:
是從1開始的

創(chuàng)建:
var arr = new Array();
var arr = []

規(guī)范:
可以傳任何數據

操作數組:
根據數組中的某一個位置獲取數據 數組名【索引】length

遍歷數組:
可以通過for循環(huán)

獲取長度
數組名.length

修改數組指定的元素:
數組名[下標] = 值;//修改
清空數組:
數組名.length= 0;//清空數組
數組最后追加新元素:
數組名[數組中.lrngth-1] = 值取刃;//添加最后一個元素

函數創(chuàng)建
創(chuàng)建 function num(形參數){}
調用 num()
// 問題:針對按需使用的程序蹋肮,在使用的地方每次都復制源代碼出刷,造成代碼
形參:創(chuàng)建的函數形參
實參和形參是一一對應的,函數名是顧名思義的坯辩。
實參是調用里的就是實參

返回值
return關鍵字是配合函數的使用的
數組總結
冒泡排序 筆試題 手寫----過程 就是重復的【比較相鄰的數字】
規(guī)律:比較多少趟數
內層循環(huán)比較多少次 數組名馁龟。length-1
找到兩個相鄰的兩個位置

return 數據
函數體內沒有返回值 :就會返回undefined

    })(實參)//這是調用
       // 讓匿名函數和''運算符''配合使用
    // "("function(){"}"
    // (function()()調用{})//這個用的多一點
    // !function(){}//運算符!語法不報錯濒翻,這就是匿名函數
    // -function(){}//運算符- 語法不報錯屁柏,這就是匿名函數
    (function fn(){})

匿名函數
(function(){
console.log(1)
console.log(1)
console.log(1)
})();//小括號就是調用了,只能用一次
// 自調用-創(chuàng)建好函數有送,馬上執(zhí)行

arguments 偽數組----只能在函數體內使用
可以獲取用戶傳入的所有實參
操作時淌喻,可以像數組一樣
針對用戶傳入的實參個數不確定時可以選用arguments,其它情況依然要寫參數

創(chuàng)建對象:
var arr = new Object{}
var arr = {}
創(chuàng)建對象
之前必須得先有模板(構造函數)

昨天作業(yè)總結:
階乘:
需求:寫一個函數雀摘,并返回值裸删,(如:3的階乘,1x2x3)阵赠;
功能:實現階乘
參數:
num表示是一個數組number
返回值:返回一個數字 (返回的結果是階乘的結果)
注意:未來不要在函數中處理結果涯塔,因為結果是要交給使用者的,使用者根據自己需求處理結果
質數:不懂

簡單計算機:
用函數封裝:實現加減乘除的效果
參數:
數值1清蚀,數值2匕荸,數值三(代表運算符)
技術用swicth寫的
返回值
回調函數

作用域:
全局變量:全局變量就是在函數外定義的var變量就是去全局變量
局部變量:就是函數體內的var定義的變量以及參數都是局部變量

作用域鏈:一個函數嵌套另一個函數:找本身的的變量,如果找不到就去上一級去找枷邪,這就形成了作用域鏈

預解析:提升變量榛搔、函數提升
變量提升,提升到當前作用域
函數提升东揣,提升到當前作用域
構造函數創(chuàng)建方式:
var arr = new Object();
var arr = {};
創(chuàng)建數組
var arr = Array()
var arr = []

函數表達式
var fn = function(){}

函數聲明
function fn(){}

創(chuàng)建對象
var arr = Object();
var arr = {}

匿名函數
(function fn(){})

自定義構造函數:
復習

函數進階
作用域
全局作用域 函數外部定義的var關鍵字就是全局作用域践惑,函數體外執(zhí)行環(huán)境
局部作用域 函數體內的執(zhí)行環(huán)境
作用域鏈 先從本身,如沒有去上級查找嘶卧,就形成了作用域鏈

與解析
提升變量var 僅僅提成的變量名 函數聲明整體會提升

函數創(chuàng)建方式
函數表達式
var 變量名 = function(){}
類型function就是函數的類型

匿名函數和自執(zhí)行函數
(function fn(){}())
就是自調用尔觉、后面哪個括號就是調用

arguments
在js中不用寫形參,像數組一樣獲取每一個下標芥吟,偽數組

對象基礎:
屬性和方法組成的
屬性:靜態(tài) 男
方法:動態(tài) 會吃侦铜、會跑
【創(chuàng)建對象】:
構造函數:1、系統(tǒng)給的 2钟鸵、自定義的
系統(tǒng)提供的構造函數:Object
創(chuàng)建方式1
var wc = new Object()

創(chuàng)建方式2 經常用
var wc = {}

添加屬性:
語法1:對象名.key = value
語法2:對象名['kay'] = value
獲缺枚睢:
對象名:key
對象名['kay']
調用方法:
對象名.方法名()

添加屬性:
name:'旺財',.....
刪除
delete 對象名.值

檢測對象的成員是否存在
語法:對象名.hasOwnProperty('age')
返回:存在true 不存在false

檢測一個對象是否某個類型
對象名 instanceof 構造函數名
是的true 不是false

遍歷:
數組:可以通過for循環(huán)遍歷,因為有索引携添,而且是有序的索引
數組:一組有序的數據集合嫁盲。
對象:一組無序的數據集合。
遍歷對象: for-in
在變量的過程中,key表示對象中某一個鍵名(屬性名或方法名)是一個變量羞秤,所以在使用時使用中括號的方式訪問缸托。
注意:遍歷中不要使用點的方式獲取鍵所對應的值。
for(var key in lb) {
console.log(lb[key])
}
構造函數
object Array function

創(chuàng)建一個自定義構造函數
1瘾蛋、創(chuàng)建對象 function num(){}
2俐镐、this.屬性=值;
3、var r = new 對象名(值);
new1和new2比較的是內存地址 那么就等于false
注意:自定義構造函數對象首字母是大寫哺哼,調用的時候用new的方式

new關鍵字的執(zhí)行過程
1佩抹、向內存中申請一塊空間,將要創(chuàng)建的對象
2取董、this關鍵字指向當前創(chuàng)建的對象(指向內存申請的這一塊空間)
3棍苹、通過this向內存中的空間添加屬性與方法
4、外部變量會接受所創(chuàng)建好的對象

相同:都是函數
不同點:
1茵汰、規(guī)范:普通函數命名要符合( 駝峰命名法)枢里;調用:直接調用
2、規(guī)范:構造函數命名法要符合蹂午,帕斯卡命名法(對象名首字母大寫)調用:通過new的方式調用

03基本數據類型和引用數據類型區(qū)別【理解】
1栏豺、棧和堆
2、基本數據類型 和 引用數據類型作為函數傳參時

內置對象:
系統(tǒng)所提供的對象如:Object豆胸、Array奥洼、Math、Date等等

宿主對象:js所運行環(huán)境的對象比如:Bom中的window晚胡、Dom中的document

自定義對象:自定義構造函數所創(chuàng)建的對象

內置對象--Math
console.log(Math)
// 屬性
console.log(Math.PI);
// 方法 絕對值
var r = Math.abs(-100);
// console.log(r)
// 四舍五入
var r = Math.round(100.1)
console.log(r);
// 向上取整
var r = Math.ceil(100.1);
console.log(r)
// 向下取整
var r = Math.floor(100.9999);
console.log(r);
// 最大數
var r = Math.max(1,7,2,54,9,4);
console.log(r)
// 最小數
var r = Math.min(824,4,57586,2);
console.log(r);
內置對象--Date

02操作對象
1溉卓、獲取和設置屬性與方法
2、刪除對象的成員
3搬泥、檢測對象成員
4、遍歷對象成員
5伏尼、檢測對象函數創(chuàng)建對象
5忿檩、new關鍵字和普通函數的區(qū)別

this方法指向

的是調用者

日期對象-date

3.2 Math對象常用屬性和方法

  • Math.abs(數字); 獲取一個數字的絕對值
  • Math.round(數字); 四舍五入
  • Math.PI; π
  • Math.ceil(數字); 向上取整
  • Math.floor(數字); 向下取整
  • Math.random(); 隨機數[0,1);
  • Math.max(數字,數字,數字...); 求最大數
  • Math.min(數字,數字,數字...); 求最小數

// gat 獲取
創(chuàng)建一個日期對象
var date = new Date()

// 獲取
var year = date.getFullYear() //獲取年份
var month = date.getMonth()  //獲取月份  是從0到11月份
var day = date.getDate()       //獲取日期  
var hours = date.getHours()   //獲取小時
var Minutes = date.getMinutes()  //獲取分鐘
var Seconds = date.getSeconds() //獲取 秒
var Milliseconds = date.getMilliseconds() //獲取毫秒
var d = date.getDay()//獲取星期數
var time = date.getTime();//獲取總毫秒//獲取從1970到某一個時間點額時間戳
document.write(time);
// document.write(date)

設置 set

內置對象---數組對象
unshift 數組前面添加
shift 數組前面刪除
push 數組后面添加
pop 數組后面刪除

數組任意位置添加和刪除 刪除 修改 添加
splice()
1、在第幾個位置
2爆阶、在刪除幾個
3燥透、添加數據

檢測一個數據在數組中的位置 indexOf()

返回數據類型:number、string辨图、undefiend班套、unll、Boolean故河、object
 返回-1 表示不存在
 indexOf('aa',1);第一個之后查找aa

反轉
reverse()反轉

排序
sort
要用匿名函數吱韭,規(guī)則

截取
arr.slice
var j = arr.slice(1,3); //包括1不包括3,也就是截取第一個和第二個

拼接
arr.join('傳參')
默認用 '逗號' 拼接

\n 表示換行 \t tab鍵縮進

數組遍歷
1鱼的、數組名.forEach(function(value,index,currentArray){
console.log(value);
});

2理盆、過濾出符合篩選條件的元素痘煤,返回一個新的數組
數組名.filter(function(value,index,currentArray){
return 條件;    // 如:return value >= 1000;
});
3、// 驗證數組中的每一個元素是否都符合指定的條件,返回布爾值
數組名.every(function(value,index,currentArray){
return 條件;    // 如:return value >= 1000;
});
4猿规、// 驗證數組中的元素衷快,是否有符合指定條件的,返回布爾值
數組名.some(function(value,index,currentArray){
return 條件;  // 如:return value >= 1000;
});
5姨俩、// 遍歷數組中的每一個元素蘸拔,更改后存入一個新的數組中,返回一個新的數組
數組名.map(function(value,index,currentArray){
 return 操作;   // 如:return value * 2;
});

清空數組的方法:
舉栗:
var arr = [11,44,22,66];
方式1
arr = [ ]
方式2
arr.length = 0;
方式3
arr.splice(0,arr.length)

string字符串的不可變性【了解】
var str = 'abc';
str = 'hello';
當重新給str賦值的時候环葵,數據'abc'不會被修改调窍,依然在內存中
重新給字符串賦值,會重新在內存中開辟空間积担,這個特點就是字符串的不可變
由于字符串的不可變陨晶,在大量拼接字符串的時候會有效率問題
基本包裝對象【了解】
普通字符串
var str = 'abc'; // 普通字符串不是對象
var len = str.length; // 但是為什么可以像對象一樣使用點出東西?
alert(len); //3

把字符串包裝成對象 → 基本包裝類型
var strObj = new String('abc');  // 把字符串包裝成對象
var len = strObj.length;  // 因為是對象帝璧,所以可以點出東西先誉。
alert(len); //3

字符串對象常用的方法
字符串所有的發(fā)方法 都 不會修改字符串本身(字符串是不可變性的),
操作完成會 返回一個新的字符串

獲取字符串中的單個字符
字符串.charAt()
字符串[ibdex]的烁;推薦使用

字符串的拼接和截取
字符串.concat(1,2,3..);
拼接符 + 推薦使用
截群侄:字符串.slice(start,end);

查詢字符串是否在字符串中存在
字符串.indexOf();
字符串.lastIndexOf()

字母字符大小寫轉換
字符串.toUpperCase() //轉換大寫
字符串.toLowerCase()//轉換小寫

字符串替換:
字符串.replace(oldStr,newStr); 默認僅僅修改一次

字符串分割:
字符串.split();

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市渴庆,隨后出現的幾起案子铃芦,更是在濱河造成了極大的恐慌,老刑警劉巖襟雷,帶你破解...
    沈念sama閱讀 206,311評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件刃滓,死亡現場離奇詭異,居然都是意外死亡耸弄,警方通過查閱死者的電腦和手機咧虎,發(fā)現死者居然都...
    沈念sama閱讀 88,339評論 2 382
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來计呈,“玉大人砰诵,你說我怎么就攤上這事“葡裕” “怎么了茁彭?”我有些...
    開封第一講書人閱讀 152,671評論 0 342
  • 文/不壞的土叔 我叫張陵,是天一觀的道長扶歪。 經常有香客問我理肺,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,252評論 1 279
  • 正文 為了忘掉前任哲嘲,我火速辦了婚禮贪薪,結果婚禮上,老公的妹妹穿的比我還像新娘眠副。我一直安慰自己画切,他們只是感情好,可當我...
    茶點故事閱讀 64,253評論 5 371
  • 文/花漫 我一把揭開白布囱怕。 她就那樣靜靜地躺著霍弹,像睡著了一般。 火紅的嫁衣襯著肌膚如雪娃弓。 梳的紋絲不亂的頭發(fā)上典格,一...
    開封第一講書人閱讀 49,031評論 1 285
  • 那天,我揣著相機與錄音台丛,去河邊找鬼耍缴。 笑死,一個胖子當著我的面吹牛挽霉,可吹牛的內容都是我干的防嗡。 我是一名探鬼主播,決...
    沈念sama閱讀 38,340評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼侠坎,長吁一口氣:“原來是場噩夢啊……” “哼蚁趁!你這毒婦竟也來了?” 一聲冷哼從身側響起实胸,我...
    開封第一講書人閱讀 36,973評論 0 259
  • 序言:老撾萬榮一對情侶失蹤他嫡,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后庐完,有當地人在樹林里發(fā)現了一具尸體钢属,經...
    沈念sama閱讀 43,466評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 35,937評論 2 323
  • 正文 我和宋清朗相戀三年门躯,在試婚紗的時候發(fā)現自己被綠了淆党。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,039評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡生音,死狀恐怖,靈堂內的尸體忽然破棺而出窒升,到底是詐尸還是另有隱情缀遍,我是刑警寧澤,帶...
    沈念sama閱讀 33,701評論 4 323
  • 正文 年R本政府宣布饱须,位于F島的核電站域醇,受9級特大地震影響,放射性物質發(fā)生泄漏。R本人自食惡果不足惜譬挚,卻給世界環(huán)境...
    茶點故事閱讀 39,254評論 3 307
  • 文/蒙蒙 一醒串、第九天 我趴在偏房一處隱蔽的房頂上張望芹务。 院中可真熱鬧,春花似錦、人聲如沸颓芭。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,259評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽抖甘。三九已至,卻和暖如春闷尿,著一層夾襖步出監(jiān)牢的瞬間塑径,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工填具, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留统舀,地道東北人。 一個月前我還...
    沈念sama閱讀 45,497評論 2 354
  • 正文 我出身青樓劳景,卻偏偏與公主長得像誉简,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子枢泰,可洞房花燭夜當晚...
    茶點故事閱讀 42,786評論 2 345

推薦閱讀更多精彩內容