js学习 函数

Posted 山海南话

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js学习 函数相关的知识,希望对你有一定的参考价值。

javascript有三种声明函数的方法

(1)function命令

function print(s) {
  console.log(s);
}

(2)函数表达式

1.var print = function(s) {
  console.log(s);
};

2.var print = function x(){
  console.log(typeof x);
};

x
// ReferenceError: x is not defined

print()
// function

3.var f = function f() {};

将匿名函数赋予变量,如果不匿名,也只在内部有效

函数表达式定义函数最后要加上分号代表结束

(3)Function构造函数

可以传递任意数量的参数给Function构造函数,但只有最后一个参数被当做函数体

Function构造函数可以不使用new命令,返回结果完全一样

var add = new Function(
  \'x\',
  \'y\',
  \'return x + y\'
);

// 等同于
function add(x, y) {
  return x + y;
}

此方法比较不常用  第一种方法倒更熟悉

如果一个函数被多次声明,后面的声明就会覆盖前面的声明

调用函数时和其他语言大致相同,使用圆括号运算符

第一等公民 

Js把函数看成一种值,与其他值(数值,字符串,布尔值等)地位相同

凡是可以使用值的地方,就能使用函数,函数只是一个可以执行的值

function add(x, y) {
  return x + y;
}

// 将函数赋值给一个变量
var operator = add;

// 将函数作为参数和返回值
function a(op){
  return op;
}
a(add)(1, 1)
// 2

函数提升

 

函数的属性和方法

name属性:返回函数名字  如果采用表达式定义函数,且function后有名字,则返回那个名字

length属性:返回函数预期传入的参数个数

toString():返回一个字符串,内容是函数的源码,以及注释

对于var命令来说,局部变量只能在函数内部声明,在其他区块中声明,一律都是全局变量

函数内部也有变量提升,var命令声明的对象,不管在什么位置,变量声明都会被提升到函数体的头部

函数本身的作用域

函数本身作用域就是声明时所在的作用域,与运行时所在作用域无关

在定义时绑定作用域

var a = 1;
var x = function () {
  console.log(a);
};

function f() {
  var a = 2;
  x();
}

f() // 1

函数的参数  

可以省略,但没办法只省略靠前的参数,而保留靠后的参数,如果一定要省略靠前的参数,只有显式传入undefined

参数传递对原值的影响

如果是原始类型的值,无影响,只是一份拷贝

如果传入的是对象,则修改其属性的话,原值会受到影响

但把对象整个替换掉,不会影响原始值,因为相当于指向其他地址

同名参数

如果有同名参数,则取最后出现的那个值

function f(a, a) {
  console.log(a);  //a为最后一个a
}

f(1) // undefined 相当于f(1,undefined)

 

arguments对象

由于js允许函数提供不定数目的参数,所以需要一种机制,可以在函数体内部读取所有参数,这就是arguments对象的由来

arguments对象包含函数运行时所有参数,使用类似数组

如果在非严格模式下还可以在函数内部修改参数的值,严格模式下只读

通过它的length属性,可以判断函数调用时到底带了几个参数

与数组关系:

是对象,不能使用数组方法,除非转换为数组

var args = Array.prototype.slice.call(arguments);

// 或者
var args = [];
for (var i = 0; i < arguments.length; i++) {
  args.push(arguments[i]);
}

arguments自带一个callee属性1,返回它所对应的原函数,可以用这个写递归

arguments每个函数运行时都有,无需显式声明

函数的闭包

闭包即能够读取其他函数内部变量的函数,可以简单理解为“定义在一个函数内部的函数”

用处:1.读取函数内部变量 2.记住诞生的环境

function createIncrementor(start) {
  return function () {
    return start++;
  };
}

var inc = createIncrementor(5);

inc() // 5
inc() // 6
inc() // 7

 3.封装对象的私有属性和方法,感觉像类 

function Person(name) {
  var _age;
  function setAge(n) {
    _age = n;
  }
  function getAge() {
    return _age;
  }

  return {
    name: name,
    getAge: getAge,
    setAge: setAge
  };
}

var p1 = Person(\'张三\');
p1.setAge(25);
p1.getAge() // 25

立即调用的函数表达式,声明时就调用(IIFE)

(function(){ /* code */ }());
// 或者
(function(){ /* code */ })();

 所以以下写法都行

var i = function(){ return 10; }();
true && function(){ /* code */ }();
0, function(){ /* code */ }();
!function () { /* code */ }();
~function () { /* code */ }();
-function () { /* code */ }();
+function () { /* code */ }();

通常只对匿名函数使用

目的:1.不必命名,避免污染全局变量 2。在IIFE内部形成了一个单独的作用域,可以封装一些外部无法读取的私有变量

eval命令 

eval命令接受一个字符串作为参数,并将这个字符串当做语句执行

eval(\'var a = 1;\');
a // 1

如果无法执行就报错

如果eval的参数不是字符串,那么会原样返回

eval的作用域是当前作用域,因此小心修改当前作用域变量的值

eval本质是在当前作用域中注入代码,由于安全风险和不利于js引擎优化执行速度,一般不推荐使用

最常用的场合是解析json数据的字符传递,不过正确做法应该使用原生的JSON.parse方法

js规定,凡是使用别名执行eval,eval内部一律是全局作用域

var a = 1;

function f() {
  var a = 2;
  var e = eval;
  e(\'console.log(a)\');
}

f() // 1

  

 

  

 

  

  

 

  

以上是关于js学习 函数的主要内容,如果未能解决你的问题,请参考以下文章

几个关于js数组方法reduce的经典片段

web代码片段

JS常用代码片段-127个常用罗列-值得收藏

ES7-Es8 js代码片段

谷歌浏览器调试jsp 引入代码片段,如何调试代码片段中的js

VSCode自定义代码片段——JS中的面向对象编程