CoffeeScript函数

如果大家有看我之前关于ES6的箭头函数的话,这一篇也不会很难理解。我们这一次可以说一下,关于两者的一些细微差别。

基本

在CoffeeScript中,任何函数都是用箭头函数来表示的。也就是说,如果我们使用下列的方式书写coffee,编译是不予以通过的。

function greeting(){ console.log('hello coffee') }  //error

那我们该如何写函数呢?和ES6的arrows一样(不一样的地方待会儿会提及)。

greeting = () ->
console.log('hello coffee') -----------编译后-----------
var greeting; greeting = function() {
return console.log('hello coffee');
};

函数名字放在号前面,参数放在()里。编译后的script也是遵循every thing has a return。但是建议你在需要提前添加return的语句,自行添加。这样会使你的代码更清晰。

请再次记住coffee的层次是通过缩进体现的,所以缩进是非常重要的!书写coffee,千万不能tab和space混用!如果混用了,记得使用你手中的IDE进行修正。

关于this的=>胖箭头

this,是Javascript学习中最重要的一个点。因为当我们理解清楚了this的指向后,我们的代码才会更简洁易用。我之前也写过一篇关于this指针的,欢迎围观吐槽。

其实我在es6那篇也讲过了,es6的arrows,最好的一点就是帮我们解决了this的绑定问题。但是一旦我们不需要它对this进行绑定,我们就需要写非arrows型的函数,这不统一的感觉难免让人难受。那我们来看看coffee君,是怎么样处理这个事情的呢?

obj = {
string: 'hello coffee',
greeting: () =>
console.log(this.string)
}
-----------编译后-----------
var obj; obj = {
string: 'hello coffee',
greeting: (function(_this) {
return function() {
return console.log(_this.string);
};
})(this)
};

当然,要看清楚,箭头是胖箭头=>。使用这种胖箭头,它便会为你处理this的绑定问题。我们也可以看一下coffee编译后的解决方案。

其实就是包多了一层立即执行的匿名函数,并把this作为参数传进去。这样,this就会被_this所引用。这里利用了闭包,解决了this的指向问题。

参数

既然讲到了函数,那就顺便说一下和函数紧密相关的参数吧。

默认值

在我们使用原生js的时候,为了使传入的参数有默认值,我们需要自行对参数进行undefined和null判断,再为其赋初始值。这个过程其实是非常繁琐的。所以coffee为我们提供了语法糖,让我们处理默认值更顺手。来看一下代码:

gretting = (time, name = 'Yika') ->
console.log("good #{time}, #{name}")
-----------编译后-----------
var gretting; gretting = function(time, name) {
if (name == null) {
name = 'Yika';
}
return console.log("good " + time + ", " + name);
};

其实,默认值很简单对吧。编译后会自动为你判断name是否存在。这个不是重点,难道你没发现吗?重点在于,上面的例子,竟然出现了和模板引擎一样的东西。没错,#{}这个东西,会为你自动拼接字符串,让你省去烦恼!

#{}

既然提到了#{}这个东西,那我当然要告诉你一个坑,单引号和双引号不再一样了!当你要使用此类字符串模板一样的东西时,请时刻记住,使用双引号。只要是Js中的变量,它都会为你尝试用加号进行拼接。

name = 'Yika'
age = 20 string = "My name is #{name}, I am #{age}"
-----------编译后-----------
var age, name, string; name = 'Yika'; age = 20; string = "My name is " + name + ", I am " + age;

其实函数的东西并不太多,你所要做的,就是不断训练自己用coffee优雅的书写代码。等你用的和原生Js一样习惯后,请享受它。

我会选择sass和coffee,就是因为两者都是用缩进进行区分的。哈哈。

最后,还是请大家记住,缩进!缩进!缩进!

CoffeeScript学习(3)—— 函数的更多相关文章

  1. JavaScript学习09 函数本质及Function对象深入探索

    JavaScript学习09 函数本质及Function对象深入探索 在JavaScript中,函数function就是对象. JS中没有方法重载 在JavaScript中,没有方法(函数)重载的概念 ...

  2. C++学习之函数指针

     C++学习之函数指针          和数据项类似,函数也有地址,函数的地址是存储在机器语言代码的内存的开始地址.通常,这些地址对用户而言,不重要也没什么用处,但对程序而言,它却很有用. 一.函数 ...

  3. Javascript学习5 - 函数

    原文:Javascript学习5 - 函数 在Javascript中,函数和对象是交织在一起的.有些函数的特性与对象相关联.这一点的内容在第六部分会讨论到. 这一部分主要讨论函数与其它比较熟悉的语言( ...

  4. 《python基础教程(第二版)》学习笔记 函数(第6章)

    <python基础教程(第二版)>学习笔记 函数(第6章) 创建函数:def function_name(params):  block  return values 记录函数:def f ...

  5. python学习8—函数之高阶函数与内置函数

    python学习8—函数之高阶函数与内置函数 1. 高阶函数 a. map()函数 对第二个输入的参数进行第一个输入的参数指定的操作.map()函数的返回值是一个迭代器,只可以迭代一次,迭代过后会被释 ...

  6. python学习7—函数定义、参数、递归、作用域、匿名函数以及函数式编程

    python学习7—函数定义.参数.递归.作用域.匿名函数以及函数式编程 1. 函数定义 def test(x) # discription y = 2 * x return y 返回一个值,则返回原 ...

  7. CoffeeScript学习(1)——Quick Start

    什么是CoffeeScript CoffeeScript 是一门编译到 JavaScript 的小巧语言. 在 Java 般笨拙的外表下, JavaScript 其实有着一颗华丽的心脏. Coffee ...

  8. CoffeeScript 学习笔记

    1.什么叫 CoffeeScript CoffeeScript 是一种新的编程语言,构建于 JavaScript 之上.CoffeeScript 提供了一种简洁的语法,对 Python 或 Ruby ...

  9. MySql学习(四) —— 函数、视图

    注:该MySql系列博客仅为个人学习笔记. 本篇博客主要涉及MySql 函数(数学函数.字符串函数.日期时间函数.流程控制函数等),视图. 一.函数 1. 数学函数 对于数学函数,若发生错误,所有数学 ...

随机推荐

  1. QTP公开课视频-持续更新中。。。

    以下是视频的下载地址: http://pan.baidu.com/share/link?shareid=1760499709&uk=3711405498

  2. PHP开发经验总结

    1.使用内嵌的HTML代码,而不是PHP的echo语句. 因为PHP是一门嵌入式Web编程语言,可以将HTML代码和PHP代码相互嵌入.但是很多程序员担心在HTML代码中过多的使用”"嵌入P ...

  3. Linux 线程属性函数总结

    1.初始化一个线程对象的属性 int pthread_attr_init(pthread_attr_t *attr); 返回值:若是成功返回0,否则返回错误的编号 形 参: attr 指向一个线程属性 ...

  4. IS_ERR、PTR_ERR、ERR_PTR

    最近在使用filp_open打开文件时遇到到一个问题,当打开一个并不存在的文件时,filp_open返回值值为0xfffffffe,而并不是0(NULL),这是因为内核对返回指针的函数做了特殊处理.内 ...

  5. IOS地址

    IOS开发-你不可缺少的资源汇总-知识分享-转   如何用Facebook graphic api上传视频: http://developers.facebook.com/blog/post/532/ ...

  6. oracle lsnrctl status|start|stop

    [oracle@redhat4 ~]$ lsnrctl status LSNRCTL for Linux: Version 11.2.0.1.0 - Production on 06-OCT-2015 ...

  7. Android应用程序中应用图标和名字的设置

    在AndroidManifest.xml文件中设android:icon和 android:label指定名字和图标的位置,如: <application android:icon=" ...

  8. 8天学通MongoDB——第八天 驱动实践

    作为系列的最后一篇,得要说说C#驱动对mongodb的操作,目前驱动有两种:官方驱动和samus驱动,不过我个人还是喜欢后者, 因为提供了丰富的linq操作,相当方便. 官方驱动:https://gi ...

  9. poj 3792 Area of Polycubes (简单模拟)

    题目 题意:在三维坐标系中,给定n个立方体的中心坐标,立方体的边长为1,按照输入顺序,后来输入的必须和之前输入的立方体有公共的边. 而且,不能和之前输入的立方体相同. 如果满足条件,输出表面积.如果不 ...

  10. CentOS6.2下fastDFS的完整安装和配置步骤

    centos6.2系统下安装配置FastDFS步骤: 1:安装libevent(libevent-2.0.16-stable) ##卸载系统自带libevent rpm -qa|grep libeve ...