您的当前位置:首页正文

JavaScript常用数学函数用法示例

2023-12-08 来源:站点网
导读本文实例讲述了JS定义函数的几种常用方法。分享给大家供大家参考,具体如下:在 JavaScript 语言里,函数是一种对象,所以可以说函数是 JavaScript 里的一等公民(first-class citizens)。之前我们这样定义过一个函数:function greet(greeting, name) { return `${greeting}, ${name}`}因为在 JavaScript 里面是对象(object),所以它会有一些属性还有方法。比如 name 属性是函数的名字,le

PS:这里再为大家推荐几款计算工具供大家进一步参考借鉴:

在线一元函数(方程)求解计算工具:http://tools.jb51.net/jisuanqi/equ_jisuanqi

科学计算器在线使用_高级计算器在线计算:http://tools.jb51.net/jisuanqi/jsqkexue

在线计算器_标准计算器:http://tools.jb51.net/jisuanqi/jsq

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript数学运算用法总结》、《JavaScript操作DOM技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript遍历算法与技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。

小编还为您整理了以下内容,可能对您也有帮助:

JS定义函数的几种常用方法小结

本文实例讲述了JS定义函数的几种常用方法。分享给大家供大家参考,具体如下:

在 JavaScript 语言里,函数是一种对象,所以可以说函数是 JavaScript 里的一等公民(first-class citizens)。

之前我们这样定义过一个函数:

function greet(greeting, name) {

return `${greeting}, ${name}`

}

因为在 JavaScript 里面是对象(object),所以它会有一些属性还有方法。比如 name 属性是函数的名字,length 属性指的是函数里面有多少个必须要传递的参数。比如访问上面定义的这个函数里的两个属性:

greet.name

// 输出 greet

greet.length

// 输出 2,表示有两个参数

函数都是 Function 的实例,所以你可以访问 Function 上定义的属性:name,length,可以使用方法:apply(),call()。可以这样证明:

greet instanceof Function

// 返回 'true'

函数表达式

函数是对象,也可以说函数是一个值,因为在 JavaScript 里面,它跟其它类型的值是一样的,比如字符串,数字。这就可以让我们使用函数表达式的方法来定义函数,也就是定义一个匿名函数(anonymous function),再把它交给一个变量。像这样:

var greet = function (greeting, name) {

return `${greeting}, ${name}`

}

Lambda 表达式

ES6 可以让我们用 Lambda 表达式,也就是箭头函数(fat arrow function),看起来像这样:

var greet = (greeting, name) => {

return `${greeting}, ${name}`

}

上面这个函数的主体部分只有一行,就是 return 了一个字符串,所以我们可以让它更简洁一些:

var greet = (greeting, name) => `${greeting}, ${name}`

箭头右边的东西会自动被返回(return)。

对象里的方法

如果有一个函数是在一个对象里,一般我们称这种函数是对象的一个方法(method)。

试一下:

var obj = {

greet: function (greeting, name) {

return `${greeting}, ${name}`

}

}

ES6 可以让我们这样为对象定义方法:

var obj = {

greet (greeting, name) {

return `${greeting}, ${name}`

}

}

上面定义了一个名字是 obj 的对象,在它里面添加了一个叫 greet 的方法。要使用这个方法可以这样:

obj.greet('hello', ' my name is X ')

// 返回 “ hello, my name is X ”

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。JavaScript函数如何使用

函数就是通过共同定义相同的处理并使其可以多次使用,接下来的这篇文章就来给大家介绍关于JavaScript中函数的用法。

如果代码很多的话,有时可能需要用到大量相同的处理,虽然可以通过复制粘贴来省去时间,但是代码会变得很长,不方便后续的一些操作,这时候我们可以将相同的处理定义为一个函数,然后调用这个函数,这样代码就会看起来非常的简洁了。

此外函数还有一个优点,当需要处理的部分代码需要进行共同的变化时,只需要更改一处就可以了。

下面我们来看JavaScript中函数的定义

基本形式

在定义函数时首先需要的是function。之后写下给函数的名称并在{}中写入需要的处理,最简单的编写的话就像下面这样

<script>

function 函数名( ) {

处理的代码

}

</script>参数和返回值

此外,如果要将参数传递给函数,请将参数名称放在括号中。您可以根据需要添加任意数量的参数,以“,”分隔。因此,即使进行相同的处理,也可以地根据传递的参数进行内容的处理。

另外,如果你想获得这个调用函数的处理结果,使用return的关键字,则会传递函数中处理的结果返回值。

<script>

function 函数名(参数1,参数2,...){

处理的代码

return 返回值;

}

</ script>我们下面来看使用函数编程的具体例子

我们先使用变量来编写,将变量定义为money,根据输入的money的值,用document.write输出字符串“有钱人”,“普通人”,“贫穷”三个类型。

代码如下

<!DOCTYPE html>

<html>

<head>

<meta charset = "utf-8">

<title>JavaScript</title>

</head>

<body>

<script>

var money;

if (money > 5000) {

document.write("有钱人");

} else if (money > 3000){

document.write("普通人");

} else {

document.write("贫穷");

}

</script>

</body>

</html>基于上述代码,根据输入的money值,执行的结果会为“有钱人”或“普通人”或“贫穷”,如果不使用函数,则必须写入相同的代码。

<script>

var money=10000;

if (money > 5000) {

document.write("有钱人");

} else if (money > 3000){

document.write("普通人");

} else {

document.write("贫穷");

}

</script>变量money的值输入10000,则输出结果为“有钱人”

当变量money输入为4000,结果就为"普通人",输入money的值为2000时就是“贫穷”。

所以你只需要改变var money的值,其他都不需要改变,但代码就会变得很多,这个时候如果定义一个函数,代码就会变得简单的多

我们接着就来看使用函数具体的示例

这里的函数名称是judge。因为想根据输入变量money的值来判断“有钱人”“普通人”“贫穷”。

实际上,您无法分辨传递给函数的信息是什么,因此使用变量money定义参数。该函数将根据进入变量money的值来改变输出的值和字符串。

function judge(money) {

if (money > 5000) {

document.write("有钱人");

} else if (money > 3000){

document.write("普通人");

} else {

document.write("贫穷");

}

}这样做的话,就可以删除目前已编写和重复多次的代码,并将其替换为名为judge的函数。

代码如下

<script>

function judge(money) {

if (money > 5000) {

document.write("有钱人");

} else if (money > 3000){

document.write("普通人");

} else {

document.write("贫穷");

}

}

var money = 10000;

judge(money);

var money = 4000;

judge(money);

var money = 2000;

judge(money);

</script>运行结果如下

使用return值返回

也可以在不使用document.write的情况下返回判断结果的字符串。这种情况下,使用返回值return。将判断结果的字符串“有钱人”“普通”“穷”代入后,最后用return返回到result的变量的值。

代码如下

<script>

function judge(money) {

var result;

if (money > 5000) {

result = "有钱人";

} else if (money > 3000){

result = "普通人";

} else {

result = "贫穷";

}

return result;

}

var money = 10000;

var result = judge(money);

document.write(result);

var money = 4000;

var result = judge(money);

document.write(result);

var money = 2000;

var result = judge(money);

document.write(result);

</script>运行效果不变

最后,我们来简单看一下什么是局部变量

局部变量是指在函数中定义的变量,并且只在该函数中有作用。

使用“var变量名”声明与普通变量没有区别,但在局部变量的情况下,它是在function中声明。

JS函数的几种定义方式分析_javascript技巧

本文实例讲述了JS函数的几种定义方式。分享给大家供大家参考,具体如下:

JS函数的定义方式比较灵活,它不同于其他的语言,每个函数都是作为一个对象被维护和运行的。

先看几种常用的定义方式:

function func1([参数]){/*函数体*/}

var func2=function([参数]){/*函数体*/};

var func3=function func4([参数]){/*函数体*/};

var func5=new Function();

上述第一种方式是最常用的方式,不用多说。

第二种是将一匿名函数赋给一个变量,调用方法:func2([函数]);

第三种是将func4赋给变量func3,调用方法:func3([函数]);或func4([函数]);

第四种是声明func5为一个对象。

再看看它们的区别:

但同样是定义函数,在用法上有一定的区别。

用同样的方法可以去理解第三种定义方式。

第四种定义方式也是需要声明对象后才可以引用。

希望本文所述对大家JavaScript程序设计有所帮助。

JS中几种常见的高阶函数

高阶函数:英文叫Higher-order function。JavaScript的函数其实都指向某个变量。既然变量可以指向函数,函数的参数能接收变量,那么一个函数就可以接收另一个函数作为参数,这种函数就称之为高阶函数。

一个最简单的高阶函数:

编写高阶函数,就是让函数的参数能够接收别的函数。

下面介绍三个高阶函数:

一、map/rece

如果你读过Google的那篇大名鼎鼎的论文“MapRece: Simplified Data Processing on Large Clusters”,你就能大概明白map/rece的概念。由于map()方法定义在JavaScript的Array中,我们调用Array的map()方法,传入我们自己的函数,就得到了一个新的Array作为结果:

1、map():

所以,map()作为高阶函数,事实上它把运算规则抽象了,因此,我们不但可以计算简单的f(x)=x2,还可以计算任意复杂的函数,比如,把Array的所有数字转为字符串:

2、rece():

再看rece的用法。Array的rece()把一个函数作用在这个Array的[x1, x2, x3...]上,这个函数必须接收两个参数,rece()把结果继续和序列的下一个元素做累积计算,其效果就是:

二、filter

filter也是一个常用的操作,它用于把Array的某些元素过滤掉,然后返回剩下的元素。和map()类似,Array的filter()也接收一个函数。和map()不同的是,filter()把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素。

可见用filter()这个高阶函数,关键在于正确实现一个“筛选”函数。

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

三、sort排序算法

因为Array的sort()方法默认把所有元素先转换为String再排序,结果'10'排在了'2'的前面,因为字符'1'比字符'2'的ASCII码小。如果不知道sort()方法的默认排序规则,直接对数字排序,绝对栽进坑里!

幸运的是,sort()方法也是一个高阶函数,它还可以接收一个比较函数来实现自定义的排序。

JS中几种常见的高阶函数

高阶函数:英文叫Higher-order function。JavaScript的函数其实都指向某个变量。既然变量可以指向函数,函数的参数能接收变量,那么一个函数就可以接收另一个函数作为参数,这种函数就称之为高阶函数。

一个最简单的高阶函数:

编写高阶函数,就是让函数的参数能够接收别的函数。

下面介绍三个高阶函数:

一、map/rece

如果你读过Google的那篇大名鼎鼎的论文“MapRece: Simplified Data Processing on Large Clusters”,你就能大概明白map/rece的概念。由于map()方法定义在JavaScript的Array中,我们调用Array的map()方法,传入我们自己的函数,就得到了一个新的Array作为结果:

1、map():

所以,map()作为高阶函数,事实上它把运算规则抽象了,因此,我们不但可以计算简单的f(x)=x2,还可以计算任意复杂的函数,比如,把Array的所有数字转为字符串:

2、rece():

再看rece的用法。Array的rece()把一个函数作用在这个Array的[x1, x2, x3...]上,这个函数必须接收两个参数,rece()把结果继续和序列的下一个元素做累积计算,其效果就是:

二、filter

filter也是一个常用的操作,它用于把Array的某些元素过滤掉,然后返回剩下的元素。和map()类似,Array的filter()也接收一个函数。和map()不同的是,filter()把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素。

可见用filter()这个高阶函数,关键在于正确实现一个“筛选”函数。

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

三、sort排序算法

因为Array的sort()方法默认把所有元素先转换为String再排序,结果'10'排在了'2'的前面,因为字符'1'比字符'2'的ASCII码小。如果不知道sort()方法的默认排序规则,直接对数字排序,绝对栽进坑里!

幸运的是,sort()方法也是一个高阶函数,它还可以接收一个比较函数来实现自定义的排序。

JavaScript实现计算多边形质心的方法示例

本篇文章给大家带来的内容是关于JavaScrip数据结构之数组的相关操作介绍(附示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

数据结构的分类

数据结构是指相互之间存在着一种或多种关系的数据元素的集合和该集合中数据元素之间的关系组成 。
常用的数据结构有:数组,栈,链表,队列,树,图,堆,散列表等,如图所示:

3254277457-5c62b5e46fa2e_articlex.png

数组

数组是最简单的内存数据结构,数组是可以再内存中连续存储多个元素的结构,在内存中的分配也是连续的,数组中的元素通过数组下标进行访问,数组下标从0开始。
tips:数据一般存储着一系列数据类型相同的值,但在JavaScript中,可以在数组中保存不同类型的值,但一般不需要这么用。

1.创建数组

let daysOfWeek = new Array();let daysOfWeek = new Array(7);let daysOfWeek = new Array('1', '2', '3', '4', '5', '6', '7');

2.添加元素

// 初始化nums数组let nums = [0,1,2,3,4,5,6];// 指定位置添加nums[nums.length] = 7;// 使用push(),把元素添加到数组末尾nums.push(8);// 0...8nums.push(9, 10);// 0...10// 使用unshift,把元素添加到数组首位nums.unshift(-1);// -1...10nums.unshift(-3,-2);// -3...10

3.删除元素

// pop(),删除最后一个nums.pop();//-3...9// shift(),删除第一个nums.shift();//-2...9

4.任何位置删除或添加元素

// splice()方法nums.splice(2, 3);// 删除 index=2 开始的后的3个数 -2,-1,3...9nums.splice(2, 0, 0, 1, 2);// 从index=2开始插入0,1,2 -2...9

5.javascript数组方法参考

concat() // 连接2个或多个数组,并返回结果every() // 对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回truefilter() // 对数组中的每一项运行给定函数,返回该函数能返回true的项作为新数组forEach() // 对数组中的每一项运行给定函数,没有返回值join() // 按传入的字符连接成一个字符串indexOf() // 从前往后遍历,返回第一个与传入参数相等的索引值,没找到返回-1lastIndexOf() // 从后往前遍历,返回第一个与传入参数相等的索引值map() // 对数组中的每一项运行给定函数,返回每次函数调用的结果组成新的数组reverse() // 颠倒数组中元素的顺序slice() // 传入索引值,将数组对应索引值范围内的元素作为新数组返回 some() // 对数组中的每一项运行给定函数,如果某一项返回true,则返回truesort() // 按照字母顺序排序,支持传入指定排序方法的函数作为参数toString() // 将数组作为字符串返回valueOf() // 和toString类似,将数组作为字符串返回

6.ES6数组新增方法

@@iterator // 返回一个包含数组键值对的迭代器对象,可通过同步调用得到数组元素的键值对copyWithin() // 复制数组中一系列元素,到该数组指定的起始位置entries() // 返回包含数组所有键值对的@@iteratorincludes() // 数组中存在某个元素则返回true,否则返回false(es7新增)find() // 根据回调函数给定的条件从数组中查找元素,如果找到则返回该元素findIndex() // 根据回调函数给定的条件从数组中查找元素,如果能找到就返回该元素在数组中的索引fill() // 用传入参数填充数组from() // 根据已有数组创建一个新数组keys() // 返回包含数组所有索引的@@iteratorof() // 根据传入的参数创建一个新数组values() // 返回包含数组中所有值的@@iterator

7.数组优缺点
优点:
(1)按照索引查询元素速度快
(2)按照索引遍历数组方便

缺点:
(1)数组的大小固定后就无法扩容了
(2)数组只能存储一种类型的数据
(3)添加,删除的操作慢,因为要移动其他的元素。

适用场景:
频繁查询,对存储空间要求不大,很少增加和删除的情况。

JavaScript实现计算多边形质心的方法示例

本篇文章给大家带来的内容是关于JavaScrip数据结构之数组的相关操作介绍(附示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

数据结构的分类

数据结构是指相互之间存在着一种或多种关系的数据元素的集合和该集合中数据元素之间的关系组成 。
常用的数据结构有:数组,栈,链表,队列,树,图,堆,散列表等,如图所示:

3254277457-5c62b5e46fa2e_articlex.png

数组

数组是最简单的内存数据结构,数组是可以再内存中连续存储多个元素的结构,在内存中的分配也是连续的,数组中的元素通过数组下标进行访问,数组下标从0开始。
tips:数据一般存储着一系列数据类型相同的值,但在JavaScript中,可以在数组中保存不同类型的值,但一般不需要这么用。

1.创建数组

let daysOfWeek = new Array();let daysOfWeek = new Array(7);let daysOfWeek = new Array('1', '2', '3', '4', '5', '6', '7');

2.添加元素

// 初始化nums数组let nums = [0,1,2,3,4,5,6];// 指定位置添加nums[nums.length] = 7;// 使用push(),把元素添加到数组末尾nums.push(8);// 0...8nums.push(9, 10);// 0...10// 使用unshift,把元素添加到数组首位nums.unshift(-1);// -1...10nums.unshift(-3,-2);// -3...10

3.删除元素

// pop(),删除最后一个nums.pop();//-3...9// shift(),删除第一个nums.shift();//-2...9

4.任何位置删除或添加元素

// splice()方法nums.splice(2, 3);// 删除 index=2 开始的后的3个数 -2,-1,3...9nums.splice(2, 0, 0, 1, 2);// 从index=2开始插入0,1,2 -2...9

5.javascript数组方法参考

concat() // 连接2个或多个数组,并返回结果every() // 对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回truefilter() // 对数组中的每一项运行给定函数,返回该函数能返回true的项作为新数组forEach() // 对数组中的每一项运行给定函数,没有返回值join() // 按传入的字符连接成一个字符串indexOf() // 从前往后遍历,返回第一个与传入参数相等的索引值,没找到返回-1lastIndexOf() // 从后往前遍历,返回第一个与传入参数相等的索引值map() // 对数组中的每一项运行给定函数,返回每次函数调用的结果组成新的数组reverse() // 颠倒数组中元素的顺序slice() // 传入索引值,将数组对应索引值范围内的元素作为新数组返回 some() // 对数组中的每一项运行给定函数,如果某一项返回true,则返回truesort() // 按照字母顺序排序,支持传入指定排序方法的函数作为参数toString() // 将数组作为字符串返回valueOf() // 和toString类似,将数组作为字符串返回

6.ES6数组新增方法

@@iterator // 返回一个包含数组键值对的迭代器对象,可通过同步调用得到数组元素的键值对copyWithin() // 复制数组中一系列元素,到该数组指定的起始位置entries() // 返回包含数组所有键值对的@@iteratorincludes() // 数组中存在某个元素则返回true,否则返回false(es7新增)find() // 根据回调函数给定的条件从数组中查找元素,如果找到则返回该元素findIndex() // 根据回调函数给定的条件从数组中查找元素,如果能找到就返回该元素在数组中的索引fill() // 用传入参数填充数组from() // 根据已有数组创建一个新数组keys() // 返回包含数组所有索引的@@iteratorof() // 根据传入的参数创建一个新数组values() // 返回包含数组中所有值的@@iterator

7.数组优缺点
优点:
(1)按照索引查询元素速度快
(2)按照索引遍历数组方便

缺点:
(1)数组的大小固定后就无法扩容了
(2)数组只能存储一种类型的数据
(3)添加,删除的操作慢,因为要移动其他的元素。

适用场景:
频繁查询,对存储空间要求不大,很少增加和删除的情况。

Javascript调用函数方法的几种方式介绍_javascript技巧


javascript语法灵活,同一个功能有五六种实现方式并不罕见,然后再加上有些*的原型继承和异步特性,就更让人一头雾水了。我经常搞不清楚call,apply之间的区别,今天就记录一下,以免再忘了。

在javascript中,方法可以通过以下几种方式执行:

1.func(),这是最直接最常见的调用方式,也符合一般人的思维逻辑,但是在某些情况下有一些不足,下面会解释。

2.(function(arg){})(window),匿名方法调用,在构造命名空间时比较有用,后面的括号中的参数与匿名方法中的入参一一对应。

3.func.bind(sth)(),mozilla手册中提到bind是在ECMA-262 5th Edition中新增的一个特性,这里单独列出来作为一种调用方式是因为它弥补了直接调用中不能绑定作用域的缺陷。

4.func.call(),这是第二种调用方式,每个方法的原型中都定义了call方法,用来执行当前方法。

5.func.apply(),call的双胞胎兄弟。

func()

这是最常见的调用方式,在任何语言中随处可见。func(x, y)可以传入不同的参数。在某些语言,例如php,java中,这种调用足以解决一切问题。但是javascript是一门函数式语言,闭包的概念和一个奇怪的关键词this决定了这种调用方式的不足。this应该可以解释为当前代码段的作用域,会随着代码执行到不同的片段而改变,但是某些情况下我们不希望这个this被改变,例如绑定在某些dom上的事件,我们肯定不希望他们被调用的时候this被转移到了window对象上,但有时候确实如此,再比如下面的代码。
代码如下:
var a ={};
var func = function(x) {
console.log(this);
};
a.onclick = function() {
var x = 100;
func(x);
};
a.onclick();


可以把a想象成页面中的一个链接,由于我们只是想将定义好的方法绑定到onclick事件上,而不是立刻调用它,而且这个方法拥有一个参数,所以我们需要用一个匿名方法将他包起来传递给a的onclick事件。这样就有了一个问题,func中的this变成了全局对象window,显然我们并不希望如此。这个时候,使用func()这种直接调用的方式就不行了,于是我们需要将func外的this绑定到func方法上。于是就有了bind,call,apply方法。

bind

bind的目的非常简单,返回一个绑定了this对象的相同方法。上面的代码修改一行就可以实现绑定this在a对象上目的。
代码如下:
var a ={};
var func = function(x) {
console.log(this);
};
a.onclick = function() {
var x = 100;
func.bind(this)(x); // bind here
};
a.onclick();


这样,onclick事件的this就不会像无头苍蝇一样到处乱跑啦。

call & apply

call和apply要放在一起讲,因为他们实在太像了。他们都支持多参数,而且第一个参数都是即将绑定的this对象,第二个参数则是他们的区别所在,call使用独立的参数作为调用方法的入参,apply使用一个数组作为入参。有的时候我们并不是不想改变this对象,而是想人为的将他绑定到别的对象上,这个时候call和apply是很好用的。(并不是说不能用bind,不过貌似bind出现的比较晚,可能浏览器兼容性不好)。举个栗子:
代码如下:
a = {
func: function() {
this.x += 1;
},
x: 0
};
b = {
a: a,
x: 20
};
for(var i = 0; i < 10; i++){
b.a.func();
}
console.log(a.x);
console.log(b.x);


上面的a和b对象中都有x,我们希望func能针对性的修改对应的x,但是直接调用只可能修改func作用域中的x,也就是a.x。修改一下代码,就可以实现修改b.x目的
代码如下:
a = {
func: function() {
this.x += 1;
},
x: 0
};
b = {
a: a,
x: 20
};
for(var i = 0; i < 10; i++){
b.a.func.call(b); // bind this to b
}
console.log(a.x);
console.log(b.x);


这个栗子举得不好,有点牵强附会,而且这是一种很容易让人迷惑的代码风格,有适用的场景,但不是处处都可用。

Javascript调用函数方法的几种方式介绍_javascript技巧


javascript语法灵活,同一个功能有五六种实现方式并不罕见,然后再加上有些*的原型继承和异步特性,就更让人一头雾水了。我经常搞不清楚call,apply之间的区别,今天就记录一下,以免再忘了。

在javascript中,方法可以通过以下几种方式执行:

1.func(),这是最直接最常见的调用方式,也符合一般人的思维逻辑,但是在某些情况下有一些不足,下面会解释。

2.(function(arg){})(window),匿名方法调用,在构造命名空间时比较有用,后面的括号中的参数与匿名方法中的入参一一对应。

3.func.bind(sth)(),mozilla手册中提到bind是在ECMA-262 5th Edition中新增的一个特性,这里单独列出来作为一种调用方式是因为它弥补了直接调用中不能绑定作用域的缺陷。

4.func.call(),这是第二种调用方式,每个方法的原型中都定义了call方法,用来执行当前方法。

5.func.apply(),call的双胞胎兄弟。

func()

这是最常见的调用方式,在任何语言中随处可见。func(x, y)可以传入不同的参数。在某些语言,例如php,java中,这种调用足以解决一切问题。但是javascript是一门函数式语言,闭包的概念和一个奇怪的关键词this决定了这种调用方式的不足。this应该可以解释为当前代码段的作用域,会随着代码执行到不同的片段而改变,但是某些情况下我们不希望这个this被改变,例如绑定在某些dom上的事件,我们肯定不希望他们被调用的时候this被转移到了window对象上,但有时候确实如此,再比如下面的代码。
代码如下:
var a ={};
var func = function(x) {
console.log(this);
};
a.onclick = function() {
var x = 100;
func(x);
};
a.onclick();


可以把a想象成页面中的一个链接,由于我们只是想将定义好的方法绑定到onclick事件上,而不是立刻调用它,而且这个方法拥有一个参数,所以我们需要用一个匿名方法将他包起来传递给a的onclick事件。这样就有了一个问题,func中的this变成了全局对象window,显然我们并不希望如此。这个时候,使用func()这种直接调用的方式就不行了,于是我们需要将func外的this绑定到func方法上。于是就有了bind,call,apply方法。

bind

bind的目的非常简单,返回一个绑定了this对象的相同方法。上面的代码修改一行就可以实现绑定this在a对象上目的。
代码如下:
var a ={};
var func = function(x) {
console.log(this);
};
a.onclick = function() {
var x = 100;
func.bind(this)(x); // bind here
};
a.onclick();


这样,onclick事件的this就不会像无头苍蝇一样到处乱跑啦。

call & apply

call和apply要放在一起讲,因为他们实在太像了。他们都支持多参数,而且第一个参数都是即将绑定的this对象,第二个参数则是他们的区别所在,call使用独立的参数作为调用方法的入参,apply使用一个数组作为入参。有的时候我们并不是不想改变this对象,而是想人为的将他绑定到别的对象上,这个时候call和apply是很好用的。(并不是说不能用bind,不过貌似bind出现的比较晚,可能浏览器兼容性不好)。举个栗子:
代码如下:
a = {
func: function() {
this.x += 1;
},
x: 0
};
b = {
a: a,
x: 20
};
for(var i = 0; i < 10; i++){
b.a.func();
}
console.log(a.x);
console.log(b.x);


上面的a和b对象中都有x,我们希望func能针对性的修改对应的x,但是直接调用只可能修改func作用域中的x,也就是a.x。修改一下代码,就可以实现修改b.x目的
代码如下:
a = {
func: function() {
this.x += 1;
},
x: 0
};
b = {
a: a,
x: 20
};
for(var i = 0; i < 10; i++){
b.a.func.call(b); // bind this to b
}
console.log(a.x);
console.log(b.x);


这个栗子举得不好,有点牵强附会,而且这是一种很容易让人迷惑的代码风格,有适用的场景,但不是处处都可用。

js有哪几种典型函数

第一类:常规函数

包括以下9个函数:

(1)alert函数:显示一个警告对话框,包括一个OK按钮。

(2)confirm函数:显示一个确认对话框,包括OK、Cancel按钮。

(3)escape函数:将字符转换成Unicode码。

(4)eval函数:计算表达式的结果。

(5)isNaN函数:测试是(true)否(false)不是一个数字。

(6)parseFloat函数:将字符串转换成符点数字形式。

(7)parseInt函数:将符串转换成整数数字形式(可指定几进制)。

(8)prompt函数:显示一个输入对话框,提示等待用户输入。

第二类:数组函数

包括以下4个函数:

(1)join函数:转换并连接数组中的所有元素为一个字符串。

(2)langth函数:返回数组的长度。

(3)reverse函数:将数组元素顺序颠倒。

(4)sort函数:将数组元素重新排序。

第三类:日期函数

包括以下20个函数:

(1)getDate函数:返回日期的“日”部分,值为1~31

(2)getDay函数:返回星期几,值为0~6,其中0表示星期日,1表示星期一,...,6表示星期六

(3)getHours函数:返回日期的“小时”部分,值为0~23。

(4)getMinutes函数:返回日期的“分钟”部分,值为0~59。见上例。

(5)getMonth函数:返回日期的“月”部分,值为0~11。其中0表示1月,2表示3月,...,11表示12月。见前面的例子。

(6)getSeconds函数:返回日期的“秒”部分,值为0~59。见前面的例子。

(7)getTime函数:返回系统时间。

(8)getTimezoneOffset函数:返回此地区的时差(当地时间与GMT格林威治标准时间的地区时差),单位为分钟。

(9)getYear函数:返回日期的“年”部分。返回值以1900年为基数,例如1999年为99。

(10)parse函数:返回从1970年1月1日零时整算起的毫秒数(当地时间)。

(11)setDate函数:设定日期的“日”部分,值为0~31。

(12)setHours函数:设定日期的“小时”部分,值为0~23。

(13)setMinutes函数:设定日期的“分钟”部分,值为0~59。

(14)setMonth函数:设定日期的“月”部分,值为0~11。其中0表示1月,...,11表示12月。

(15)setSeconds函数:设定日期的“秒”部分,值为0~59。

(16)setTime函数:设定时间。时间数值为1970年1月1日零时整算起的毫秒数。

(17)setYear函数:设定日期的“年”部分。

(18)toGMTString函数:转换日期成为字符串,为GMT格林威治标准时间。

(19)setLocaleString函数:转换日期成为字符串,为当地时间。

(20)UTC函数:返回从1970年1月1日零时整算起的毫秒数,以GMT格林威治标准时间计算。

第四类:数学函数

函数有以下18个:

(1)abs函数:即Math.abs(以下同),返回一个数字的绝对值。

(2)acos函数:返回一个数字的反余弦值,结果为0~π弧度(radians)。

(3)asin函数:返回一个数字的反正弦值,结果为-π/2~π/2弧度。

(4)atan函数:返回一个数字的反正切值,结果为-π/2~π/2弧度。

(5)atan2函数:返回一个坐标的极坐标角度值。

(6)ceil函数:返回一个数字的最小整数值(大于或等于)。

(7)cos函数:返回一个数字的余弦值,结果为-1~1。

(8)exp函数:返回e(自然对数)的乘方值。

(9)floor函数:返回一个数字的最大整数值(小于或等于)。

(10)log函数:自然对数函数,返回一个数字的自然对数(e)值。

(11)max函数:返回两个数的最大值。

(12)min函数:返回两个数的最小值。

(13)pow函数:返回一个数字的乘方值。

(14)random函数:返回一个0~1的随机数值。

(15)round函数:返回一个数字的四舍五入值,类型是整数。

(16)sin函数:返回一个数字的正弦值,结果为-1~1。

(17)sqrt函数:返回一个数字的平方根值。

(18)tan函数:返回一个数字的正切值。

第五类:字符串函数

包括以下20个函数:

(1)anchor函数:产生一个链接点(anchor)以作超级链接用。anchor函数设定<A NAME...>的链接点的名称,另一个函数link设定<A HREF=...>的URL地址。

(2)big函数:将字体加到一号,与<BIG>...</BIG>标签结果相同。

(3)blink函数:使字符串闪烁,与<BLINK>...</BLINK>标签结果相同。

(4)bold函数:使字体加粗,与<B>...</B>标签结果相同。

(5)charAt函数:返回字符串中指定的某个字符。

(6)fixed函数:将字体设定为固定宽度字体,与<TT>...</TT>标签结果相同。

(7)fontcolor函数:设定字体颜色,与<FONT COLOR=color>标签结果相同。

(8)fontsize函数:设定字体大小,与<FONT SIZE=n>标签结果相同。

(9)indexOf函数:返回字符串中第一个查找到的下标index,从左边开始查找。

(10)italics函数:使字体成为斜体字,与<I>...</I>标签结果相同。

(11)lastIndexOf函数:返回字符串中第一个查找到的下标index,从右边开始查找。

(12)length函数:返回字符串的长度。(不用带括号)

(13)link函数:产生一个超级链接,相当于设定<A HREF=...>的URL地址。

(14)small函数:将字体减小一号,与<SMALL>...</SMALL>标签结果相同。

(15)strike函数:在文本的中间加一条横线,与<STRIKE>...</STRIKE>标签结果相同。

(16)sub函数:显示字符串为下标字(subscript)。

(17)substring函数:返回字符串中指定的几个字符。

(18)sup函数:显示字符串为上标字(superscript)。

(19)toLowerCase函数:将字符串转换为小写。

(20)toUpperCase函数:将字符串转换为大写。

JavaScript中几个操作元素对象的函数方法

1、getElementById(id)方法

JavaScript中的getElementById中的方法,将返回一个与它有着相同ID属性元素节点的对应对象。这里值得注意的是getElementById写法一定要注意大小写,否则会出错。

getElementById()是document对象的特有函数,它只有一个参数值:如果你想获得某个ID属性元素的值,那么它的写法如下

类似语法:

document.getElementById(ID)

2、getElementsByTagName(tag)方法

getElementsByTagName()方法返回一个对象数组,这个对象数组中的每一个对象对应着文档里有着给定标签的一个元素。

类似语法:

document.getElementsByTagName(tag)

例子:

如果想获取对象中所有的"li"标签

document.getElementsByTagName("li");

这个调用将返回一个对象数组,数组中的每一个对象分别对应里document文档中的一个列表元素(li标签)。关于这个对象数组的操作方法和其它数组一样,要以使用数组的"length"属性。

代码如下:

for(var i=0;i < document.getElementsByTagName("li").length;i++){
    //这里是操作方法
    alert(typeof document.getElementsByTagName("li")[i]);
}

3、getElementsByClassName(class)方法

getElementsByClassName()是HTML5中新增的方法,在一些老式的浏览器中不支持此方法,所有使用时要注意!

getElementsByClassName()和上面的二个函数方法一样,结合document(文档对象)使用。

类似语法:

document.getElementsByClassName(class)

JavaScript中几个操作元素对象的函数方法

1、getElementById(id)方法

JavaScript中的getElementById中的方法,将返回一个与它有着相同ID属性元素节点的对应对象。这里值得注意的是getElementById写法一定要注意大小写,否则会出错。

getElementById()是document对象的特有函数,它只有一个参数值:如果你想获得某个ID属性元素的值,那么它的写法如下

类似语法:

document.getElementById(ID)

2、getElementsByTagName(tag)方法

getElementsByTagName()方法返回一个对象数组,这个对象数组中的每一个对象对应着文档里有着给定标签的一个元素。

类似语法:

document.getElementsByTagName(tag)

例子:

如果想获取对象中所有的"li"标签

document.getElementsByTagName("li");

这个调用将返回一个对象数组,数组中的每一个对象分别对应里document文档中的一个列表元素(li标签)。关于这个对象数组的操作方法和其它数组一样,要以使用数组的"length"属性。

代码如下:

for(var i=0;i < document.getElementsByTagName("li").length;i++){
    //这里是操作方法
    alert(typeof document.getElementsByTagName("li")[i]);
}

3、getElementsByClassName(class)方法

getElementsByClassName()是HTML5中新增的方法,在一些老式的浏览器中不支持此方法,所有使用时要注意!

getElementsByClassName()和上面的二个函数方法一样,结合document(文档对象)使用。

类似语法:

document.getElementsByClassName(class)

用javascript语言中的自定义函数计算三个数的平均值

function getAverage(){

var n = arguments.length;

var sum = 0;

for(i=0;i<n;i++){

sum += Number(arguments[i]);

}

return sum/n;

}

alert(getAverage(12,13,14));

理论上可以求无数多个数的平均值追问嗯,我试了的,无论多少个都可以计算

function()函数的具体用法

函数实际上是一个统一的代码块,你可以随时调用它。所有函数的开头必须加上“function()”

给函数命名:最好的命名方法是,函数拥有的名称和它所表现的功能相一致。

function()函数语法:

function 函数名(参数1 [参数2])

{

函数体

return 返回值

}

举例:

<html>

<body>

<?php>

function writeMyName()

{echo "Kai Jim Refsnes";}

writeMyName();

扩展资料:

Function,表示子例程的一般性名词。在某些编程语言中,它指带返回值的子例程或语句。在一些编程语言中起着关键字的作用。

在Python中,function是非常重要而且常见的,一般获取类或函数的参数信息。

在脚本语言javascript中,function是定义一个函数的关键字,通常形态是

函数名 = function (参数1 [参数2])

{

函数体

return 返回值

}

其中也可以不返回值。

参考资料:百度百科-Function

站点网还为您提供以下相关内容希望对您有帮助:

JS定义函数的几种常用方法小结

表示有两个参数函数都是 Function 的实例,所以你可以访问 Function 上定义的属性:name,length,可以使用方法:apply(),call()。

JS中几种常见的高阶函数

二、filter filter也是一个常用的操作,它用于把Array的某些元素过滤掉,然后返回剩下的元素。和map()类似,Array的filter()也接收一个函数。和map()不同的是,filter()把传入的函数依次作用于每个元素,然后根据返回值是tr...

如何随机获得3-23之间的整数(请用JS代码实现)

1. Math.random(); 结果为0-1间的一个随机数(包括0,不包括1) 。2. Math.floor(num); 参数num为一个数值,函数结果为num的整数部分。?3. Math.ceil(n); 返回大于等于n的最小整数。4. Math.round(num); 参数...

JS函数的几种定义方式分析_javascript技巧

先看几种常用的定义方式:function func1([参数]){/*函数体*/}var func2=function([参数]){/*函数体*/};var func3=function func4([参数]){/*函数体*/};var func5=new Function();上述第一种方式是最常用的...

JavaScript中几个操作元素对象的函数方法

getElementsByClassName()是HTML5中新增的方法,在一些老式的浏览器中不支持此方法,所有使用时要注意!getElementsByClassName()和上面的二个函数方法一样,结合document(文档对象)使用。类似语法:document.getElementsByClassName(...

js indexof()函数用法

下面的示例说明了indexOf函数方法的用法。function IndexDemo(str2){ var str1 = "BABEBIBOBUBABEBIBOBU" var s = str1.indexOf(str2); return(s);}JavaScript中indexOf()函数方法返回一个整数值,指出 ...

用javascript语言中的自定义函数计算三个数的平均值

function getAverage(){ var n = arguments.length;var sum = 0;for(i=0;i&lt;n;i++){ sum += Number(arguments[i]);} return sum/n;} alert(getAverage(12,13,14));理论上可以求无数多个数的平均值 ...

JavaScript实现计算多边形质心的方法示例

function Area(p0,p1,p2){ var area = 0.0 ;area = p0.lng p1.lat + p1.lng p2.lat + p2.lng p0.lat - p1.lng p0.lat - p2.lng p1.lat - p0.lng p2.lat;return area / 2 ;} //line ...

内置函数的JavaScript的内置函数

1.数学函数abs 方法 返回一个数的绝对值。acos 方法 返回一个数的反余弦。anchor 方法 在对象的指定文本两端加上一个带 NAME 属性的 HTML 锚点。asin 方法 返回一个数的反正弦。atan 方法 返回一个数的反正切。atan2 方法 返回从...

在javascript中,自定义一个函数,其功能是实现两个任意数的和,怎么做...

function sum(x, y){ return x + y;} 用法示例:alert(sum(1, 2));alert(sum(1234, 5678));alert(sum(2.15, -8.47));

本文如未解决您的问题请添加抖音号:51dongshi(抖音搜索懂视),直接咨询即可。

精彩推荐

更多阅读

Top