1. 程式人生 > >JavaScript建立函式的幾種型別

JavaScript建立函式的幾種型別

2、如何將事件的監聽繫結到html的標籤中呢?

一共有2中方式:

(1)直接在html的標籤中新增on***方法=“一個或者多個js的語句;”

<button onClick="test();">新增內容</button>    其中test();代表js的語句,不代表函式

(2)使用DOM物件的on***屬性=一個函式的引用

 document.getElementById("bn").onclick=test;  其中是使用的是test,代表該函式的引用。

以下是一個例子:

function.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<div id="target">
</div>
<button id="bn"">新增內容</button>
<script type="text/javascript" src="test.js">
</script>
</body>
</html>

test.js

 var test = function ()
 {
    var ele=document.createElement("span");
    ele.innerHTML = "haha";
    document.getElementById("target").appendChild(ele);
    return function(){alert("aaa")};
}
 document.getElementById("bn").onclick=test;

3、js函式的主要作用?

(1)就是普通的函式,給標籤提供事件的響應

(2)每一個js的函式,都會自動對應一個類

(3)函式可當成類的方法

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
  function Person(name,age){
 /*
 把函式當成類使用時,函式裡面的變數可分為:
 類變數:使用方法名.變數
例項變數:this.變數
區域性變數:沒有修飾符的變數就是區域性變數


 */
 //例項變數
 this.name=name;
 this.age=age;
 //類變數
 Person.eyeNum=2;
 //類的函式
 this.info=function(){
alert("我的資訊是:"+this.name+"-->"+this.age);
 };
}
var p=new Person("孫悟空美女",50);
alert(p.name+"-->"+p.age);
alert(Person.eyeNum);
p.info();
</script>
</head>
<body>
</body>
</html>

4、如何呼叫js的函式?

一共有三種方式呼叫函式

(1)呼叫者.函式名(引數列表)

window.函式名(引數列表) window可以省略

重點:每一個函式如果不寫呼叫者的話,預設的呼叫者就是window物件

(2)函式名.call(呼叫者,引數列表)

(3)函式名.apply(呼叫者,arguments);

例如:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript">
  var a=30;
  function test(){
   alert("hello world"+a);
}
test(); 第一種呼叫方式
test.call(window); 第二種呼叫方式
var obj=new Object();  在js中,任何的函式都是獨立存在的,任何一個物件都可以隨意呼叫任何函式,但是其中的引數需要向當前的物件空進尋找、

                                                 如果當前的物件空間沒有定義,則繼續向父節點找,頂層的節點就是window物件。
        test.call(obj);

test.apply(obj,arguments);
</script>
</body>
</html>

相關推薦

JavaScript建立函式型別

2、如何將事件的監聽繫結到html的標籤中呢? 一共有2中方式: (1)直接在html的標籤中新增on***方法=“一個或者多個js的語句;” <button onClick="test();">新增內容</button>    其中test();

JavaScript規定了語言型別

JavaScript中的每一個值都有它自己的型別,JavaScript規定了七種語言型別: 1.Undefined 2.Null 3.Boolean 4.String 5.Number 6.Symbol 7.Object Undefined和Null :為什麼有的程式設計規範要求用 void 0 代替 un

JavaScript有這測試分類

要去 images 定位 真的 需要 drive google ext 測試環境 譯者按: 也許你討厭測試,但是你不得不面對它,所以至少區分一下單元測試、集成測試與功能測試?對吧… 原文: What are Unit Testing, Integration Testing

深入研究Spring-IoC :容器建立方式

1.前言 本文為對tiny-spring的學習解讀,程式碼參考自tiny-spring。一個手寫的Spring簡易版框架。 前面已經提到了Spring IOC容器的建立大致分為3個步驟。但是這個三個步驟是有一個演進的過程的,Spring容器建立方式前後有6種,從最基本的例項化建立

HTML之DocType的型別

一、什麼是DOCTYPE DOCTYPE是Document Type(文件型別)的簡寫,在頁面中,用來指定頁面所使用的XHTML(或者HTML)的版本。要想製作符合標準的頁面,一個必不可少的關鍵組成部分就是DOCTYPE宣告。只有確定了一個正確的DOCTYPE,XHTML裡的標識和CSS才能正常

servlet九大內建物件之response 的contentType 型別

引言: 在Http請求中,我們每天都在使用Content-type來指定不同格式的請求資訊,但是卻很少有人去全面瞭解content-type中允許的值有多少,這裡將講解Content-Type的可用值,以及在spring MVC中如何使用它們來對映請求資訊。 1.  Cont

JavaScript有這測試

譯者按: 也許你討厭測試,但是你不得不面對它,所以至少區分一下單元測試、整合測試與功能測試?對吧... 原文: What are Unit Testing, Integration Testing and Functional Testing? 譯者: Fundebug 為了保證可讀性,本文采用意譯而非

vue常用建立元件方式總結

最近一週需要使用vue開發一個谷歌擴充套件外掛,但是又不能在vue-cli腳手架中開發,所以只能單獨引入vue.js整個包進行指令碼植入開發。引入vue.js就代表著不能用import、require之類的引入單檔案元件檔案,只能在檔案中開發,或者多個js檔案分先後順序植入開發,然後就出現了一個尷尬

JVM系列第10講:垃圾回收的型別

我們經常會聽到許多垃圾回收的術語,例如:Minor GC、Major GC、Young GC、Old GC、Full GC、Stop-The-World 等。但這些 GC 術語到底指的是什麼,它們之間的區別到底是什麼?今天我們就來詳細說說。 Minor GC 從年輕代空間回收記憶體被稱為 Minor GC

執行緒和程序的關係 ----執行緒建立方式

程序是一個應用程式在處理機上的一次執行過程,他是一個動態的概念 ,執行緒是程序的一部分是程式執行的最小單元 一個程序中有多個執行緒 個人理解 :             

js建立函式3方式

建立函式3種方式: (1)宣告式 解析器會先讀取函式宣告,並使其在執行任何程式碼之前可以訪問; function Fn(x,y){ return x + y; } (2)匿名式 必須等到解析器執行到它所在的程式碼行才會真正被解釋執行 var

oracle行列互換型別實現淺析

oracle行列互換幾種型別實現淺析 一、行轉列(組函式和decode實現) 二、列轉行(union all實現) 三、多行轉化成字串(組函式、decode和分析函式實現) 四、字串轉換成多列(字串拆分regexp_substr)

SpringMVC Controller 返回值型別

SpringMVC Controller 返回值幾種型別 2016年06月21日 19:31:14 為who而生 閱讀數:4189 標籤: Controller 返回值型別spring mvc 更多

iOS-UIViewController建立方法和UIWindow的介紹

在程式的啟動過程中提到如果沒有storyboard時:      * 程式啟動時候, 就會呼叫代理的application:  didFinishLaunchingWithOptions:方

HTTP請求的型別

http的請求報文由:請求行、首部、空行、主體四個部分組成。其中請求行由請求方法欄位、URL欄位和HTTP協議版本欄位3個欄位組成,它們用空格分隔。例如,GET /index.html HTTP/1

資料庫鎖的型別

1) holdlock 對錶加共享鎖,且事物不完成,共享鎖不釋放。 2) tablock 對錶加共享鎖,只要statement不完成,共享鎖不釋放。 與holdlock區別,見下例: 例21 ---------------------------------------- T1:

ajax中post請求頭的型別

1,application/json(JSON資料格式) xhr.setRequestHeader("Content-type","application/json; charset=utf-8"); 這種型別是我們現在最常用的,越來越多的人把它作為請求頭,用來告訴服務端訊息主體是序列化後的

struts2建立action方式有什麼區別?

 當我們在寫action的時候,可以實現Action介面,也可以繼承Actionsupport這個類.到底這兩個有什麼區別呢? Action介面有: public static final java.lang.String SUCCESS = "success"; publ

JavaScript常用的繼承方式

功能 col 中轉 var 函數 實現 所有 目標 emp JavaScript是面向對象的弱類型語言,繼承是其重要的特性之一,這裏總結下常用的四種繼承方法。 先定義一個父級構造函數,並在其原型上添加一個speak方法 //定義父級構造函數 function Pe

Java (1)尋找一堆數字中只出現一次的數字 (2)統計一堆檔案字尾名共有型別(即統計一堆數字中出現過那個數字)

//*************(1)尋找一堆數字中只出現一次的數字*********** package cn.nrsc.test1; import java.util.ArrayList; //設計一個方法,傳入一個int型別陣列,輸出這個陣列中只出現一次的數字。