在過往學(xué)習(xí)的JavaScript都是在基礎(chǔ)，現(xiàn)在為大家介紹更為深入的JavaScript知識。

　　JavaScript函數(shù)

　　JavaScript函數(shù)和Java函數(shù)是有一部分相似的，所以學(xué)習(xí)起來也會相對簡單

　　基本構(gòu)造

　　1.直接構(gòu)造

　　//function代表函數(shù)標(biāo)志，name為函數(shù)名稱，參數(shù)可有可無
　　function name( 參數(shù) ) {
　　//...
　　return;
　　}

　　2.賦值構(gòu)造

　　//相當(dāng)于function為匿名函數(shù)，然后匿名函數(shù)所得出的值返回給name，因而name可以調(diào)用function函數(shù)
　　var name = function( 參數(shù) ){
　　//...
　　}

　　注意：

　　在JavaScript中，return的地位就是可有可無，但

　　當(dāng)存在return時(shí)，運(yùn)行到return，結(jié)束函數(shù)，并返回該值

　　當(dāng)不存在return時(shí)，全部運(yùn)行完畢，結(jié)束函數(shù)，返回underfined值

　　調(diào)用函數(shù)方法

　　當(dāng)調(diào)用函數(shù)時(shí)，直接書寫函數(shù)名稱并加上相對應(yīng)的參數(shù)即可

　　name(參數(shù))；

　　注意：

　　JavaScript可以傳入與之不對應(yīng)的參數(shù)

　　當(dāng)參數(shù)傳入較多，參數(shù)進(jìn)入函數(shù)但不代表函數(shù)內(nèi)任意參數(shù)，只是單純傳入?yún)?shù)

　　當(dāng)參數(shù)傳入較少，參數(shù)進(jìn)入函數(shù)，后面未傳入的參數(shù)在函數(shù)內(nèi)部以underfined的形式存在

　　函數(shù)參數(shù)argument和rest

　　argument代表函數(shù)中傳入進(jìn)來的所有參數(shù)，是一個(gè)數(shù)組

　　我們可以在函數(shù)中使用：

　　function name( ) {
　　//...
　　console.log(arguments[0])，
　　console.log(arguments[1])，
　　//...
　　}

　　rest代表函數(shù)中傳入進(jìn)來的未定義的參數(shù)，需要提前在函數(shù)中定義

　　我們同樣可以在函數(shù)中使用：　

　var names = function(name,age,...rest){
　　//...
　　console.log(name);
　　console.log(age);
　　for(var value of rest){
　　console.log(value)
　　}
　　}

　　代碼調(diào)試

　　我們針對上面所有知識點(diǎn)給出相應(yīng)代碼示例：

　　//我們演示argument
　　function name( ) {
　　//...
　　console.log(arguments[0])
　　}
　　//我們演示rest
　　var names = function(name,age,...rest){
　　//...
　　console.log(name);
　　console.log(age);
　　for(var value of rest){
　　console.log(value)
　　}
　　}

　　下面我們在網(wǎng)頁中進(jìn)行調(diào)試：

　　name(1,2,3,"胡桃",true)

　　1

　　names("胡桃",18,"護(hù)膜","魔女")

　　胡桃

　　18

　　護(hù)膜

　　魔女

　　變量的作用域

　　對于任何含有變量的語言，作用域是必定存在的

　　對于JavaScript，var所定義的變量實(shí)際上也是存在作用域的

　　函數(shù)體內(nèi)變量作用域解釋

　　1.假如在函數(shù)體中聲明，則在函數(shù)體外不可以使用

　　function test1() {
　　var x=1;
　　x=x+1;
　　}
　　x=x+2;//Uncaught ReferenceError: x is not defined

　　2.如果兩個(gè)函數(shù)使用了相同的變量名，只要在函數(shù)內(nèi)部，則不產(chǎn)生沖突

　　function test1() {
　　var x=1;
　　x=x+1;
　　}
　　function test2(){
　　var x=1;
　　x=x+2;
　　}

　　3.內(nèi)部函數(shù)可以使用外部函數(shù)的成員，但外部函數(shù)不能使用內(nèi)部函數(shù)的成員

　　function test3(){
　　var x=1;
　　//內(nèi)部函數(shù)使用外部函數(shù)的成員
　　function indextest(){
　　var y=1;
　　x = x+1;
　　console.log(x);
　　}
　　indextest();
　　//外部函數(shù)不可以使用內(nèi)部函數(shù)成員
　　y=y+1;//Uncaught ReferenceError: y is not defined
　　}

　　4.當(dāng)內(nèi)部函數(shù)變量和外部函數(shù)變量重名時(shí)，由內(nèi)向外查找，就近原則

　　function test4(){
　　var x=1;
　　function indextest() {
　　var x=2;
　　console.log(x);
　　}
　　indextest();//這里結(jié)果為2
　　}

　　良好的變量定義格式

　　我們在JavaScript函數(shù)中定義變量時(shí)，常常將所有變量在頭部定義完全，然后在后面使用

　　function test5(){
　　//在開頭定義好所有變量
　　var x=3,y=2,z,name;
　　//在后面可以隨便使用變量
　　x=x+2;
　　z=x+y;
　　}

　　全局變量

　　全局變量常常帶有window前綴，但默認(rèn)帶有，所以不需要書寫

　　window屬于JavaScript下的一個(gè)對象，window之下包含我們所定義的全局變量以及各種函數(shù)方法

　　function test6(){
　　var x = 1;
　　//下面所輸出的x均為上方所定義的全局變量x
　　console.log(x);
　　console.log(window.x);
　　//下面所使用的alert和window.alert具有相同代碼相同作用
　　alert(x);
　　window.alert(x);
　　}

　　我們也可以通過重新定義window下的函數(shù)方法來更改該函數(shù)原有的操作

　　//在下述操作之后，alert不會產(chǎn)生輸出作用
　　window.alert = function() {
　　}
　　alert("Hello");

　　注意：

　　JavaScript實(shí)際上只有一個(gè)全局作用域，任何變量（包括函數(shù)），假如沒有在函數(shù)作用域內(nèi)找到，就會向外查找，若在全局作用域內(nèi)均未查找到，則報(bào)錯(cuò)RefrenceError

　　局部變量

　　在JavaScript的ES5中會出現(xiàn)變量作用域過大導(dǎo)致代碼沖突的結(jié)果：

　　function test7(){
　　for(var x=1;x<10;x++){
　　console.log(x);
　　}
　　// 我們希望x的作用域只在for中，但它仍會被帶出for
　　x=x+1;
　　}

　　JavaScript在ES6中加入了新的定義類型let用來定義局部變量

　　function test7(){
　　for(let x=1;x<10;x++){
　　console.log(x);
　　}
　　//x則只在for中有作用
　　console.log(x);//Uncaught ReferenceError: x is not defined
　　}

　　常量Const

　　在JavaScript的ES6之前，我們定義常量只是采用常識約束：

　　我們假設(shè)全大寫字母的變量為常量

　　但實(shí)際上是可以修改的

　　//我們定義PI
　　var PI = 3.14；
　　//但我們?nèi)耘f可以修改
　　PI = 3.33；

　　但在JavaScript的ES6中，提供了const定義類型，它所定義的變量是真正的常量，是允許修改的：

　　//我們定義PI
　　const PI = 3.14;
　　//我們無法修改，下述代碼報(bào)錯(cuò)
　　PI = 3.33;

　　方法的定義和調(diào)用

　　方法的物理定義：

　　對象中只存在兩種東西：屬性和方法

　　對象中的函數(shù)被我們稱為方法

　　方法示例

　　我們給出方法的示例：

　　var student = {
　　//對象中包含屬性
　　name:"胡桃",
　　//對象中包含方法
　　sing:function(){
　　//this指向當(dāng)前對象的屬性
　　console.log(this.name + "在唱歌")
　　}
　　}
　　//我們在調(diào)用方法時(shí)，需要帶上對象并且加上（）
　　student.sing();

　　This和Apply的區(qū)別

　　我們稍微講解一下對象方法中的This和Apply：

　　This：無法指向，只能在對象的方法中出現(xiàn)，并且固定指向自身對象的屬性

　　Apply：可以控制this指向，在調(diào)用含有this的函數(shù)時(shí)調(diào)用，第一個(gè)參數(shù)是對象，后面是所需參數(shù)

　　我們給出案例進(jìn)行講解：

　　//首先我們給出一個(gè)外部函數(shù)來計(jì)算年齡：
　　function getAge(){
　　//這里采用了Date內(nèi)置對象，我們后面會講到，這里是獲得當(dāng)前年份
　　var nowTime = new Date().getFullYear();
　　return nowTime - this.birth;
　　}
　　//我們創(chuàng)建一個(gè)對象(直接調(diào)用getAge，相當(dāng)于this的使用)
　　var hutao = {
　　name:"胡桃",
　　birth:2002,
　　age: getAge
　　}
　　//我們直接對getAge采用apply方法，使其this指向hutao
　　//第一個(gè)參數(shù)是對象，后面均為參數(shù)所需值
　　getAge.apply(hutao,[]);

　　我們給出網(wǎng)頁端的操作:

　　//我們需要調(diào)用age時(shí)，是采用的age（）方法
　　console.log(hutao.age())
　　20
　　//這里采用getAge的apply方法
　　getAge.apply(hutao,[]);
　　20

　　內(nèi)部對象

　　JavaScript的內(nèi)部對象類似于我們Java中的常見類

　　它們同樣都是由他人創(chuàng)造并存在于JavaScript中，我們可以直接調(diào)用幫助我們編程

　　標(biāo)準(zhǔn)類型

　　我們先來介紹一些標(biāo)準(zhǔn)類型便于內(nèi)部對象的講解

　　我們先給出一個(gè)新的方法，用于分析其類型：

　　typeof 類型對象

　　我們給出案例：

　　typeof 123

　　'number'

　　typeof "123"

　　'string'

　　typeof true

　　'boolean'

　　typeof []

　　'object'

　　typeof Math.abs

　　'function'

　　typeof undefined

　　'undefined'

　　Date日期對象

　　首先我們給出日期對象的定義方法：

　　var name = new Date();

　　我們通過日期對象來進(jìn)行一些方法操作：

　　我們同時(shí)提供一些Date對象輸出日期的不同寫法（這里在網(wǎng)頁示例）：

　　now = new Date()
　　Thu Jul 14 2022 13:27:07 GMT+0800 (中國標(biāo)準(zhǔn)時(shí)間)
　　now.toLocaleString()
　　'2022/7/14 13:27:07'
　　now.toGMTString()
　　'Thu, 14 Jul 2022 05:27:07 GMT'

　　JSON字符串

　　我們先來介紹一下JSON：

　　在早期，所有數(shù)據(jù)傳輸都采用XML文件，但后來開始采用JSON傳輸

　　JSON是一種輕量級的數(shù)據(jù)交換格式

　　簡潔和清晰的層次結(jié)構(gòu)使得JSON成為理想的數(shù)據(jù)交換語言

　　益于人的閱讀和書寫，也易于機(jī)器解析和生成，有效地提升了網(wǎng)絡(luò)傳輸效率

　　在JavaScript中一切皆為對象，任何JS所支持的類型都是對象

　　格式：

　　對象都采用{}

　　數(shù)組都采用[]

　　鍵值對都采用 key:value

　　我先在這里講解一下JSON的格式，并且給出對象進(jìn)行對比：

　　//對象具有對象的形式
　　var obj = {
　　name:"萬葉",
　　eyes:"風(fēng)"
　　}
　　//JSON雖然和對象相似，但實(shí)際上是字符串，內(nèi)部所有元素都有"""所包圍
　　var json = '{"name":"萬葉","eyes":"風(fēng)"}'

　　最后我們給出JSON和對象之間的轉(zhuǎn)換：

　　var obj = {
　　name:"萬葉",
　　eyes:"風(fēng)"
　　}
　　//對象轉(zhuǎn)化為JSON字符串
　　var jsonUser = JSON.stringify(obj);
　　//JSON字符串轉(zhuǎn)化為對象
　　var wanye = JSON.parse('{"name":"萬葉","eyes":"風(fēng)"}')

　　面向?qū)ο缶幊?/p>

　　首先面向?qū)ο缶幊淌鞘裁茨兀?/p>

　　面向?qū)ο蠖季哂幸粋€(gè)模板類

　　我們根據(jù)模板類來產(chǎn)生對象并對其進(jìn)行操作

　　JavaScript的類和對象

　　JavaScript的面向?qū)ο笈c其他面向?qū)ο笥幸稽c(diǎn)區(qū)別：

　　//我們先給出一個(gè)整體對象（類似于類，但類需要寫有數(shù)據(jù)）
　　var Student = {
　　name:"name",
　　age:18,
　　run:function() {
　　console.log(this.name + "running!")
　　}
　　};
　　//我們創(chuàng)建一個(gè)對象
　　var xiaoming = {
　　name:"xiaoming"
　　}
　　//然后我們讓小明的本源指向Student對象
　　xiaoming._proto_ = Student;
　　//下面是網(wǎng)頁測試給出的結(jié)果，我們可以看到xiaoming繼承了Student的方法
　　// xiaoming
　　// {name: 'xiaoming', _proto_: {…}}
　　// name: "xiaoming"
　　// _proto_: {name: 'name', age: 18, run: ?}
　　// [[Prototype]]: Object

　　但是在ES6版本之后，JavaScript給出了class關(guān)鍵字，具體化了類這個(gè)概念：

　　class定義模板：

　　class name{
　　//...
　　}

　　下面給出class案例：

　　class Student{
　　//class配置的constructor方法，用來創(chuàng)造對象的屬性
　　constructor(name){
　　this.name = name;
　　}
　　//方法直接在下面書寫即可
　　run(){
　　console.log(this.name + "running");
　　}
　　}
　　//創(chuàng)建新對象的方法（需要把所需參數(shù)寫入）
　　var yebao = new Student("yebao");

　　我們給出網(wǎng)頁調(diào)試結(jié)果：

　　yebao

　　Student{name: 'yebao'}

　　yebao.name

　　'yebao'

　　yebao.run()

　　4.html:19 yebaorunning

　　JavaScript進(jìn)階之函數(shù)和對象詳細(xì)知識內(nèi)容就先講到這里