使用function关键字来定义函数,分为两种形式:

  • 声明式函数定义;

     function add(m,n) {
    alert(m+n);
    }

    这种方式等同于构造一个Function类的实例的方式:

    var add = new Function("m", "n", "alert(m+n);");

    Function类构造方法的最后一个参数为函数体:"alert(m+n);",前面的都是函数的形参,参数必须是字符串形式的:"m","n"。

  • 函数表达式;
     1 //将一个匿名函数赋值给变量add
    2 var add = function(m, n) {
    3 alert(m + n);
    4 };
    5 add(1, 2);//3
    6
    7 //函数表达式作为参数传递给其他函数
    8 var arr = [1, 3, 4, 2];
    9 arr = arr.sort(function(a, b) {
    10 return a - b;
    11 });
    12 alert(arr);//1,2,3,4
    13
    14 //定义后立即调用
    15 alert( function(m, n) {
    16 return m + n;
    17 }(1, 2));
    18
    19 //函数表达式也可以定义名称(如用于递归)
    20 var f=function fact(x){
    21 if(x<1) {
    22 return 1;
    23 }else{
    24 return x*fact(x-1);
    25 }
    26 };

声明式函数定义和函数表达式的一点区别

声明式函数定义语句属于顶级作用域范围,函数调用语句可写在函数声明语句之前:

add(1, 2);//3
function add(m, n) {
alert(m + n);
}

函数表达式定义的函数在定义之前无法调用:

//TypeError: add is not a function
add(1, 2);
var add = function(m, n) {
alert(m + n);
};

函数的返回值

Javascript中的函数不需要声明返回类型,使用return关键字返回一个值。若函数不包含return语句,或者直接使用"return;",则函数的返回值为undefined。

嵌套函数

函数可以嵌套在其他的函数里面,内层函数可以访问外层函数的参数和变量:

function add(m, n) {

    function d(x) {
return x * 2;
} return d(m) + d(n);
} alert(add(1, 2));//

调用函数

函数体代码在函数被调用时才会执行。Javascript函数有4中调用方式:

  • 普通的函数调用
  • 方法调用
  • 构造函数调用
  • 通过 call() 和 apply() 间接调用

普通的函数调用

最常用的函数调用方式,如:

alert("hello");

var result = add(1, 2);

方法调用

所谓方法就是将一个函数赋给一个对象的属性:

 1 //定义一个函数
2 function hello(name) {
3 alert('hello,' + name);
4 };
5 var user = {};
6
7 //赋值给user的sayHi属性
8 user.sayHi = hello;
9
10 //方法调用
11 user.sayHi('张三');

普通的函数调用和方法调用的一个区别:在"普通的函数调用"方式中,函数的调用上下文(this的值),为全局对象(非严格模式)或者undefined(严格模式)。而在"方法调用"方式中,this指向当前对象。利用这一特性,我们可以在方法不需要明确的返回值时,直接返回this,从而实现"方法链"。如jquery中常见的:

$('#btn_edit').css({color:red}).show();

嵌套函数中的this:嵌套函数中,内层函数不会继承外层函数的this,即当内层函数作为方法调用时,内层函数的this指向当前调用对象;当内层函数作为函数调用时,this的值为全局对象(非严格模式)或者undefined(严格模式)。怎样在内层函数中访问外层函数的this呢?通常将this保存在一个局部变量中,通过变量来访问:

 1 var obj = {
2 f : function() {
3 var self = this;
4 console.log(this === obj);//true,this指向当前对象
5
6 f1();
7
8 function f1() {
9 console.log(this === obj);//false,this为全局对象或者unde
10 console.log(self === obj);//true,self指向外层this,即当前对象
11 }
12 }
13 };

构造函数调用

当使用new关键字创建一个对象时,即调用了构造函数。构造函数若没有形参,可以省略圆括号:

var obj = new Object();
//等价于
var obj = new Object;

调用构造函数,创建了一个新对象,这个新对象会成为该构造函数的调用上下文(this的值):

function User(name) {
this.name=name;
console.debug(this);
} var user = new User('张三');

call() 和 apply() 间接调用

Javascript中函数也是对象,也拥有方法。其中 call() 和 apply() 可以用来间接调用函数。call() 的第一个参数用来指定调用上下文(即this的值),后面的参数是传入调用函数的实参。

 1 var name = 'A';
2 var user = {
3 name : 'B'
4 };
5
6 function showName() {
7 alert(this.name);
8 }
9
10 showName();//A,this为全局对象
11 showName.call(user);//B,this为user对象

apply() 和 call() 类似,区别在于,后面的实参需要以数组的形式传递(可将当前函数的arguments数组直接传入)。

javascript笔记(一)的更多相关文章

  1. [Effective JavaScript 笔记] 第4条:原始类型优于封闭对象

    js有5种原始值类型:布尔值.数字.字符串.null和undefined. 用typeof检测一下: typeof true; //"boolean" typeof 2; //&q ...

  2. [Effective JavaScript 笔记] 第5条:避免对混合类型使用==运算符

    “1.0e0”=={valueOf:function(){return true;}} 是值是多少? 这两个完全不同的值使用==运算符是相等的.为什么呢?请看<[Effective JavaSc ...

  3. [Effective JavaScript 笔记]第3章:使用函数--个人总结

    前言 这一章把平时会用到,但不会深究的知识点,分开细化地讲解了.里面很多内容在高3等基础内容里,也有很多讲到.但由于本身书籍的篇幅较大,很容易忽视对应的小知识点.这章里的许多小提示都很有帮助,特别是在 ...

  4. [Effective JavaScript 笔记]第27条:使用闭包而不是字符串来封装代码

    函数是一种将代码作为数据结构存储的便利方式,代码之后可以被执行.这使得富有表现力的高阶函数抽象如map和forEach成为可能.它也是js异步I/O方法的核心.与此同时,也可以将代码表示为字符串的形式 ...

  5. [Effective JavaScript 笔记]第28条:不要信赖函数对象的toString方法

    js函数有一个非凡的特性,即将其源代码重现为字符串的能力. (function(x){ return x+1 }).toString();//"function (x){ return x+ ...

  6. 从头开始学JavaScript 笔记(一)——基础中的基础

    原文:从头开始学JavaScript 笔记(一)--基础中的基础 概要:javascript的组成. 各个组成部分的作用 . 一.javascript的组成   javascript   ECMASc ...

  7. 【原】javascript笔记之Array方法forEach&map&filter&some&every&reduce&reduceRight

    做前端有多年了,看过不少技术文章,学了新的技术,但更新迭代快的大前端,庞大的知识库,很多学过就忘记了,特别在项目紧急的条件下,哪怕心中隐隐约约有学过一个方法,但会下意识的使用旧的方法去解决,多年前ES ...

  8. JavaScript笔记目录

    JavaScript笔记目录 一.JavaScript简介 二.在HTML中使用JavaScript ...持续更新中,敬请期待

  9. 蛋糕仙人的javascript笔记

    蛋糕仙人的javascript笔记:https://www.w3cschool.cn/kesyi/kesyi-nqej24rv.html

  10. JavaScript笔记(第一章,第二章)

    JavaScript笔记(第一章,第二章) 第一章: <meta http-equiv="Content-Type" content="text/html; cha ...

随机推荐

  1. 【Postman】接口测试工具:在谷歌浏览器安装插件方法以及使用说明

    安装插件方法: <如何在谷歌浏览器chrome中离线安装.crx扩展程序的三种方法?> <postman chrome插件的安装与使用> 下载地址:http://www.cnp ...

  2. wps文档怎样去除广告

    安装完 WPS 之后右键—属性—打开文件夹位置(如图) 接下来进入 10.1.0.6929 文件夹内,再次进入 office6 文件夹内,找到 wpscenter 应用程序,将其删除.此应用包含定时弹 ...

  3. Idea中优化Markdown Support显示效果

    转自:https://www.jianshu.com/p/d093c42a8c29 因为工作中为提高工作效率,我一般习惯于直接在`idea`中使用`markdow support`插件来进行相关文档的 ...

  4. ASP.NET动态网站制作(17)-- C#(1)

    前言:用C#也有一年多了,基本上都是边用边学的,现在可以跟着老师系统的学习一下,感觉应该挺好的. 内容: 1.网站部署的相关内容:  (1)想要做一个网站,首先得去买一个域名,老师的域名是在美橙上买的 ...

  5. TortoiseSVN与VisualSVN Server搭建SVN版本控制系统(转)

    地址:http://www.cnblogs.com/xing901022/p/4399382.html

  6. Mysql字符串截取函数

    今天建视图时,用到了MySQL中的字符串截取,很是方便. 感觉上MySQL的字符串函数截取字符,比用程序截取(如PHP或JAVA)来得强大,所以在这里做一个记录,希望对大家有用. 函数: 1.从左开始 ...

  7. IM测试功能点

    测试前的总结: 1. 对象 对象就是聊天的联系人,包括个人账号,公共号,机构号,群组等. 2. 对象的属性 就是这些联系人的各个特征. 个人主页(头像,昵称,签名,管理的群,管理的轻应用,2维码... ...

  8. java servlet中上传文件的简单实现(基于第三方jar)

    这里的案例使用了两种文件上传的组件.分别介绍 1.使用JSPSmartUpload完成上传 package test_servlet_package; import java.io.File; imp ...

  9. 丢失vcruntime140.dll

    我在php7安装yaf时报了标题所提示的错误信息. 解决方案是:下载vc++2015 并安装 链接如下:https://www.microsoft.com/zh-cn/download/confirm ...

  10. R语言数据管理(二):模式与类

      最常用的4种数据类型是数值型(numeric).字符型(character)(字符串).日期型(Date)或POSIXct(基于日期的).逻辑型(logical)(TRUE或FALSE). 变量中 ...