JS函数篇【2】
什么是函数
函数的作用,可以写一次代码,然后反复地重用这个代码。
<h3 onload="add2(1,2,3);add3(4,5,6)"></h3>
<hr/>
<button style="width: 100px;height: 50px;" value="" onclick="add(10,20)">什么是函数</button>
<button style="width: 100px;height: 50px;" value="" onclick="sub()">定义函数</button>
<button style="width: 100px;height: 50px;" value="" onclick="FUNC()">函数叠加功能调用</button>
<hr/>
<h3>有参函数调用:</h3>
<button style="width: 100px;height: 50px;" value="" onclick="add4(10,20)">返回值函数</button>
<script type="text/javascript" src="../JS/jq/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
function add(a1,a2) {
var sum=a1+a2;
alert(sum);
}
//调用函数
//add(10,20);
var sum=1;
function sub(argument) {//调用函数
sum+=1;
alert(sum);
}
function FUNC(){//函数调用
for (var i =0; i < 10; i++) {
sub();
}
}
//函数传参
function add2(x,y,z){
var sum = x + y +z;
document.write(x+"、"+y+"、"+z+"和:"+sum+"<hr/>");
}
function add3(x,y,z){
var sum = x + y +z;
document.write(x+"、"+y+"、"+z+"和:"+sum+"<hr/>");
}
//返回值函数
function add4(x,y){
var result=x+y
return result;
}
var value=add4(20,10);
document.write("返回值:"+value);
</script>
1、JS函数定义
含义:JS使用关键字function定义函数,函数可以同过声明定义,也可以是一个表达式。
一:函数声明
function save(){//函数体}
二:函数表达式
var x = function (a, b) {return a * b};
三:functiion构造函数
var myFunction = new Function("a", "b", "return a * b");
var x = myFunction(4, 3);
注意:在 JavaScript 中,很多时候,你需要避免使用 new 关键字
四:函数提升:
提升:是JS默认将当前作用域提升到前面去的行为。提升应用在变量的声明与函数的声明,因此,函数可以在申明之前调用。
myFunction(5);
function myFunction(y) {
return y * y;
}
注意:使用表达式定义函数时无法提升
五:自调用函数:函数实际上是一个 匿名自我调用的函数 (没有函数名)。
(function () {
var x = "Hello!!"; // 我将调用自己
})();
六:函数可作为一个值使用也可以作为表达式使用
function myFunction(a, b) {
return a * b;
}
var x = myFunction(4, 3);
七:函数是对象
实列:
function myFunction(a, b) {
return arguments.length;
}
toString()将函数作为一个字符串返回
2、JS函数参数
一:JavaScript 函数参数:
1、显式参数:函数显式参数在函数定义时列出。
functionName(parameter1, parameter2, parameter3) {
code to be executed
}
2、隐藏参数:函数隐藏参数(arguments)在函数调用时传递给函数真正的值。
3、默认参数:如果函数在调用时缺少参数,参数会默认设置为: undefined
function myFunction(x, y) {
if (y === undefined) {
y = 0;
}
}
4、Arguments 对象:JavaScript 函数有个内置的对象 arguments 对象.
argument 对象包含了函数调用的参数数组。
实例
找出最大的值
x = findMax(1, 123, 500, 115, 44, 88);
function findMax() {
var i, max = arguments[0];
if(arguments.length < 2)return max;
for (i = 0; i < arguments.length; i++) {
if (arguments[i] > max) {
max = arguments[i];
}
}
return max;
}
统计所有数值的和:
x = sumAll(1, 123, 500, 115, 44, 88);
function sumAll() {
var i, sum = 0;
for (i = 0; i < arguments.length; i++) {
sum += arguments[i];
}
return sum;
}
5、通过值传递参数:在函数中调用的参数是函数的参数。如果函数修改参数的值,将不会修改参数的初始值(在函数外定义)。
实例
var x = 1;
// 通过值传递参数
function myFunction(x) {
x++; //修改参数x的值,将不会修改在函数外定义的变量 x
console.log(x);
}
myFunction(x); // 2
console.log(x); // 1
6、通过对象传递参数:在JavaScript中,可以引用对象的值。因此我们在函数内部修改对象的属性就会修改其初始的值。修改对象属性可作用于函数外部(全局变量)。
实例
var obj = {x:1};
// 通过对象传递参数
function myFunction(obj) {
obj.x++; //修改参数对象obj.x的值,函数外定义的obj也将会被修改
console.log(obj.x);
}
myFunction(obj); // 2
console.log(obj.x); // 2
3、JS函数调用
JS函数篇【2】的更多相关文章
- js函数篇
1.闭包函数,作用:不污染全局变量, 定义:与外界隔离的独立作用域被称为闭包,使用函数实现该功能称为函数闭包: 写法: (function(){ function sayHello(){ conso ...
- Node.js进阶篇-koa、钩子函数、websocket、嵌入式开发
代码地址如下:http://www.demodashi.com/demo/12932.html 一.简介 koa是由Express原班人马打造的,致力于成为一个更小.更富有表现力.更健壮的We ...
- 如何编写高质量的 JS 函数(1) -- 敲山震虎篇
本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/7lCK9cHmunvYlbm7Xi7JxQ作者:杨昆 一千个读者,有一千个哈姆雷特. 此系列文 ...
- 如何编写高质量的 JS 函数(2) -- 命名/注释/鲁棒篇
本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/sd2oX0Z_cMY8_GvFg8pO4Q作者:杨昆 上篇<如何编写高质量的 JS 函数 ...
- 如何编写高质量的 JS 函数(3) --函数式编程[理论篇]
本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/EWSqZuujHIRyx8Eb2SSidQ作者:杨昆 [编写高质量函数系列]中, <如何 ...
- 如何编写高质量的 JS 函数(4) --函数式编程[实战篇]
本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/ZoXYbjuezOWgNyJKmSQmTw作者:杨昆 [编写高质量函数系列],往期精彩内容: ...
- JS创建对象篇
JS创建对象篇 Object构造函数创建 var person = new Object(); person.name = "Tom"; person.age = 10; pers ...
- js函数表达式和函数声明的区别
我们已经知道,在任意代码片段外部添加包装函数,可以将内部的变量和函数定义"隐 藏"起来,外部作用域无法访问包装函数内部的任何内容. 例如: var a = 2; function ...
- 2. web前端开发分享-css,js进阶篇
一,css进阶篇: 等css哪些事儿看了两三遍之后,需要对看过的知识综合应用,这时候需要大量的实践经验, 简单的想法:把qq首页全屏另存为jpg然后通过ps工具切图结合css转换成html,有无从下手 ...
随机推荐
- 【linux】查看TensorRT版本
查看TensorRT版本: dpkg -l | grep TensorRT echo nvidia@tegra-ubuntu:~$ dpkg -l | grep TensorRT ii libnvin ...
- 【Leetcode_easy】896. Monotonic Array
problem 896. Monotonic Array solution1: class Solution { public: bool isMonotonic(vector<int>& ...
- 【嵌入式硬件Esp32】ESP32使用visual studio cod界面
如何下载安装IDE Visual Studio Code大家可以在微软的官网上根据自身的开发平台下载,至于安装方法就是无脑式地按Next就好了,下载地址如下所示: Visual Studio Cod ...
- Vue简单基础 + 实例 及 组件通信
vue的双向绑定原理:Object.defineProperty() vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫 ...
- RabbitMQ官方教程二 Work Queues(GOLANG语言实现)
RabbitMQ官方教程二 Work Queues(GOLANG语言实现) 在第一个教程中,我们编写了程序来发送和接收来自命名队列的消息. 在这一部分中,我们将创建一个工作队列,该队列将用于在多个wo ...
- STM32 MDK摘记
题记:这人是越懒越懒,记性也也来越差,前段时间改了个链接文件,今天想用,竟然忘了咋写....还是勤记记吧... 随时更新,笔记帖. 不喜勿喷! 1,关于MDK链接文件宏的定义 #! armcc -E ...
- HTTP权威指南-概述
URI 统一资源标识符 类似于邮件地址,邮箱. URL 统一资源定位符 URN 统一资源名 HTTP方法 get post put delete post head 状态码 200 OK 302 重定 ...
- SCI-hub使用技巧(下载外文文献)
下载外文文献方法指南: (1)首先查找需要下载文献的DOI (2)在Sci-Hub主页搜索框输入URL.DOI或者PMID. (3)点击open即可看见下载界面. 参考文献:https://mp.we ...
- [转帖]TPC-C解析系列04_TPC-C基准测试之数据库事务引擎的挑战
TPC-C解析系列04_TPC-C基准测试之数据库事务引擎的挑战 http://www.itpub.net/2019/10/08/3331/ OceanBase这次TPC-C测试与榜单上Oracl ...
- jpa简单demo调试druid
Druid连接池配置见https://www.cnblogs.com/blindjava/p/11504524.html pom <dependency> <groupId>m ...