js函式和this用法例項分析
阿新 • • 發佈:2020-03-16
本文例項講述了js函式和this用法。分享給大家供大家參考,具體如下:
js的所有程式碼都是由funtion組成,funtion即函式的型別。
一.函式有兩種寫法
-----1.定義式
function test() { //定義一個函式 console.log("function test called!!"); }
-----2.變數式
var test2 = function () { console.log("var test2 function called!!"); };
我們可以呼叫typeof()檢視型別
var type = typeof(test2); console.log(type); //function
二.函式也是物件
-----1.函式既然是物件,即就可以有屬性和功能。函式也可以動態的增加屬性,如下:
function test() { console.log("function test() called!!!"); } test.user_name = "zhangsan"; console.log(test.user_name); //zhangsan
三.函式的例項化
函式的例項化也有兩種方式:
---------1.直接在函式名後面加上"()" @@@@@常用這種方式
function test() { console.log("function test() called!!!"); } test(); //function test() called!!!
---------2.使用關鍵字"new"進行例項化
function test() { console.log("function test() called!!!"); } new test(); //function test() called!!!
四.this機制
//=====================this機制================== function my_func(rhs,lhs) { console.log(this,rhs,lhs); } //顯示不確定的this //my_func(); //console顯示 //--------------顯示傳遞this----------- //函式名.call(this,引數...) 顯示傳遞this my_func.call({ 0: "jade" },2,3); //------------------------------------ var tools = { my_func: my_func,}; //表.key() --->this是表 tools.my_func(2,3); //this是tools // 相當於 tools.my_func.call(tools,3); //強制繫結this,優先順序最高 //函式.bind,不會改變原來函式物件的this,而是會產生一個新的臨時的物件 //bind好了this var new_func = my_func.bind({ name: "jade" }); new_func(3,4); tools.my_func = new_func; tools.my_func(3,4); //this是表{name:"jade"} my_func(3,4); //this不變,consloe //====call與bind有什麼區別呢?== //bind最牛的地方是什麼?是繫結this的時候,//不是由呼叫者來決定的 new_func.call({ 0: 1 },3,4); //this還是表{name:"jade"},不是{0:1} //==================總結============================= //在函式裡面訪問this,this是由呼叫的環境來決定的,不確定,一般不使用 //1.顯示的傳遞this,函式.call(this物件,引數) //2.隱式的傳遞this,表.key_函式(引數),this---》表 //3.bind優先級別是最高的
感興趣的朋友可以使用線上HTML/CSS/JavaScript程式碼執行工具:http://tools.jb51.net/code/HtmlJsRun測試上述程式碼執行效果。
更多關於JavaScript相關內容可檢視本站專題:《JavaScript常用函式技巧彙總》、《javascript面向物件入門教程》、《JavaScript錯誤與除錯技巧總結》、《JavaScript資料結構與演算法技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程式設計有所幫助。