基础的JavaScript函数

  • 1.首字母大写
  • 2.去除数组重复项
  • 3.数组的排序
  • 4.闭包

1. 把用户输入的不规范的英文名字,变为首字母大写,其他小写的规范名字(使用JavaScript的map函数)

var arr = ['A', 'B', 'C'];
var r = arr.filter(function (element, index, self) {
console.log(element); // 依次打印'A', 'B', 'C'
console.log(index); // 依次打印0, 1, 2
console.log(self); // self就是变量arr
return true;
});
function normalize(arr) {
return arr.map(function(item,index){
item=item.slice(0, 1).toUpperCase()+item.slice(1).toLowerCase();
return item;
})
}
normalize(['adam', 'LISA', 'barT']);

2. filter()接收的回调函数,其实可以有多个参数。通常我们仅使用第一个参数,表示Array的某个元素。回调函数还可以接收另外两个参数,表示元素的位置和数组本身

var r;
var arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
r = arr.filter(function (element, index, self) {
return self.indexOf(element) === index;
});

3. sort()数组的排序

//这是排正序
var arr = [10, 20, 1, 2];
arr.sort(function (x, y) {
if (x < y) {
return -1;
}
if (x > y) {
return 1;
}
return 0;
});
console.log(arr); // [1, 2, 10, 20] //这是排倒序
arr.sort(function (x, y) {
if (x < y) {
return 1;
}
if (x > y) {
return -1;
}
return 0;
});

4. 闭包

当一个函数返回了一个函数后,其内部的局部变量还被新函数引用。

返回的函数并没有立即执行,而是直到f()才执行。

function count() {
var arr = [];
for (var i=1; i<=3; i++) {
arr.push(function () {
return i * i;
});
}
return arr;
} var results = count();
var f1 = results[0];
var f2 = results[1];
var f3 = results[2];

在上面的例子中,每次循环,都创建一个新的函数,然后把创建的三个函数都添加到了一个Array中返回。

你可能认为调用f1(),f2()和f3()结果应该是1,4,9,但实际结果是:

f1(); // 16
f2(); // 16
f3(); // 16

全部都是16!原因就在于返回的函数引用了变量i,但它并非立刻执行。等到3个函数都返回时,它们所引用的变量i已经变成了4,因此最终结果为16。

返回闭包时牢记的一点就是:返回函数不要引用任何循环变量,或者后续会发生变化的变量。

如果一定要引用循环变量怎么办?方法是再创建一个函数,用该函数的参数绑定循环变量当前的值,无论该循环变量后续如何更改,已绑定到函数参数的值不变:

function count() {
var arr = [];
for (var i=1; i<=3; i++) {
arr.push((function (n) {
return function () {
return n * n;
}
})(i));
}
return arr;
} var results = count();
var f1 = results[0];
var f2 = results[1];
var f3 = results[2]; f1(); // 1
f2(); // 4
f3(); // 9

基础的JavaScript函数的更多相关文章

  1. 零基础讲解JavaScript函数

    一 JavaScript函数1 什么是函数  函数是一组代码(指令)的集合,通常用来完成某个单一的功能.(书的目录和章节,电视剧剧集的名称等)2 为什么要使用函数  2.1 把复杂程序划分成不同的功能 ...

  2. 前端基础之javaScript(函数)

    目录 一:javaScript函数 1.函数关键字 2.格式 3.无参函数 4.有参函数 二:关键字arguments 1.能够获取函数接受的索引参数 2.关键字arguments(限制函数不能多也不 ...

  3. js基础之javascript函数定义及种类-普通涵数-自执行函数-匿名函数

    普通函数 1.不带参数 function fucname(){ alert("hello"); } funcname() 2.带参数 function funcname(arg){ ...

  4. JavaScript 函数基础

    1. JavaScript 函数基础 1. 定义方法 2. 函数的调用方法 3. 函数方法 apply : 将函数作为数组的方法来调用 将参数以数组形式传递给该方法 call   : 将函数作为对象的 ...

  5. javaScript系列 [01]-javaScript函数基础

    [01]-javaScript函数基础 1.1 函数的创建和结构 函数的定义:函数是JavaScript的基础模块单元,包含一组语句,用于代码复用.信息隐蔽和组合调用. 函数的创建:在javaScri ...

  6. 100多个很有用的JavaScript函数以及基础写法大集合

    100多个很有用的JavaScript函数以及基础写法大集合 1.document.write("");为 输出语句2.JS中的注释为//3.传统的HTML文档顺序是:docume ...

  7. java基础62 JavaScript中的函数(网页知识)

    1.JavaScript中,函数的格式 function 函数名(形参列表){ 函数体; } 2.JavaScript中,函数需要注意的细节 1.在javaScript中,函数定义形参时,是不能使用v ...

  8. JavaScript语言精粹读书笔记 - JavaScript函数

    JavaScript是披着C族语言外衣的LISP,除了词法上与C族语言相似以外,其他几乎没有相似之处. JavaScript 函数: 函数包含一组语句,他们是JavaScript的基础模块单元,用于代 ...

  9. JavaScript函数之美~

    JavaScript函数之美~ 这篇文章,我将就以下几个方面来认识JavaScript中的函数. 函数为什么是对象,如何定义函数? 如何理解函数可以作为值被传递 函数的内部对象.方法以及属性 第一部分 ...

随机推荐

  1. <2014 04 29> c/c++常用库总结

    C 标准库 ============================================================================================== ...

  2. Spring MVC 框架结构介绍(二)

    Spring MVC框架结构 Spring MVC是围绕DispatcherServlet设计的,DispatcherServlet向处理程序分发各种请求.处理程序默认基于@Controller和@R ...

  3. 一篇搞定vue-router

    由于Vue常见于前后端分离开发场景下,所以页面跳转工作全部交给了前端,所以基于集中管理的原则,就有了vue-router插件,它给定了url和组件之间的跳转规则 Demo准备 vue init web ...

  4. awesome-modern-cpp

    Awesome Modern C++ A collection of resources on modern C++. The goal is to collect a list of resouce ...

  5. 001-docker概述、架构、window安装、基本测试

    一.概述 Docker 是一个开源的应用容器引擎,基于 Go 语言 并遵从Apache2.0协议开源. Docker 可以让开发者打包他们的应用以及依赖包到一个轻量级.可移植的容器中,然后发布到任何流 ...

  6. (转)RTP-H264封包分析

    rtp(H264)第一个包(单一NAL单元模式)————-sps 80 {V=10,p=0,x=0,cc=0000} 60 {m=0,pt=110 0000} 53 70{sequence numbe ...

  7. Python3 标准库

    Python3标准库 更详尽:http://blog.csdn.net/jurbo/article/details/52334345 文本 string:通用字符串操作 re:正则表达式操作 diff ...

  8. Servlet中参数获取方法

    在web.xml里面可以定义两种参数: 一种是全局范围的参数, 一种是servlet内的参数. web.xml里定义参数的应用举例:在做分页功能时,可以在代码中直给定pageSize的值,这样,写死在 ...

  9. JSP页面退出时清除会话Session

    我们用一个quit.jsp来处理用户退出系统的操作,quit.jsp负责注销session,及时释放资源. 注销session. 关闭浏览器窗口. 其代码如下所示: <%@ page conte ...

  10. WinForm TCP异步连接之服务器端

    C# — WinForm TCP连接之服务器端 TCP连接之服务器端,涉及到如下三个函数,分别是: /***************************** ** 函数功能: 服务端监听 ** 输 ...