ES6 学习(7) ---函数

 1 // ES6 写法
 2 function log(x, y = "World") {
 3   console.log(x, y)
 4 }  
 5 
 6 // ES5 写法
 7 function log(x, y) {
 8   y = y || ‘World‘;
 9   console.log(x, y);
10 }
11 
12 //
13 let x = 99;
14 funtion foo(Y = x + 1) {
15   console.log(Y)  
16 }
17 foo() // 100 每次调用都会重新计算 X + 1

 1 // 1, 参数必须是一个对象
 2 function foo({x, y = 5}) {
 3   console.log(x, y);
 4 }
 5 
 6 foo({}) // undefined 5
 7 foo({x: 1}) // 1 5
 8 foo({x: 1, y: 2}) // 1 2
 9 foo() // TypeError: Cannot read property ‘x‘ of undefined
10 
11 // 2, 第二种方法可以解决，第一种方法不传参会报错的现象
12 // 这种方法是解构后 参数使用默认值
13 function foo({x, y = 5} = {}) {
14   console.log(x, y);
15 }
16 
17 foo() // undefined 5
18 
19 // 3, 默认值是一个有具体属性的参数，直接解构赋值参数
20 function m2({x, y} = { x: 0, y: 0 }) {
21   return [x, y];
22 }

 1 function f(x, y = 5, z) {
 2   return [x, y, z];
 3 }
 4 
 5 f() // [undefined, 5, undefined]
 6 f(1) // [1, 5, undefined]
 7 f(1, ,2) // 报错
 8 f(1, undefined, 2) // [1, 5, 2]
 9 
10 // 上面代码中，有默认值的参数不是尾参数。这时，无法只省略该参数，而不省略它后面的参数，除非显式输入undefined。
11 
12 // 只有传参是 undefined 的时候才能出发函数使用默认值

 1 // 返回函数参数的个数
 2 (function (a) {}).length // 1
 3 
 4 // 返回 默认值参数之前参数的个数
 5 (function (a = 1) {}).length // 0
 6 (function (a, b, c = 1) {}).length // 2
 7 (function (a = 0, b, c) {}).length // 0
 8 (function (a, b = 1, c) {}).length // 1
 9 
10 // ...rest, ...args 不计入参数的个数
11 (function(...args) {}).length // 0

var x = 1;

function f(x, y = x) { // 此处的 x 为参数，实参赋值给形参 x， x 赋值给 y， 此时参数形参的作用域相当于 {let x;  y = x}
  console.log(y);
}

f(2) // 2

1 let x = 1;
2 
3 function f(y = x) { // 参数形参的作用域中 x 未定义，因此 x 指向外层作用域的 x
4   let x = 2;
5   console.log(y);
6 }
7 
8 f() // 1

1 function f(y = x) { // 此时 参数形成的作用域及window下 x 均为定义会报错
2   let x = 2;
3   console.log(y);
4 }
5 
6 f() // ReferenceError: x is not defined

var x = 1;

function foo(x = x) { // 参数形成的作用域相当于 {let x = x}
  // ...
}

foo() // ReferenceError: x is not defined

1 let foo = ‘outer‘;
2 
3 function bar(func = () => foo) { // 参数为函数，同上，参数形成的作用域 { func = () => foo} 此作用域内没有 foo 变量就要往上一层作用域中找
4   let foo = ‘inner‘;
5   console.log(func());
6 }
7 
8 bar(); // outer

var x = 1;
function foo(x, y = function() { x = 2; }) { // 参数形成的作用域相当于 { let x;function(){ x = 2}}; y 函数执行,x 的赋值，只是给作用域的x赋值，并不会影响 全局和函数内的变量x
  var x = 3;
  y();
  console.log(x);
}

foo() // 3
x // 1

1 var x = 1;
2 function foo(x, y = function() { x = 2; }) { // 参数形成的作用域同上，但函数内的 x 指向参数x，因此 x = 3 赋值给参数 x， 当 y函数执行时，有给参数 x赋值为2，因此打印x为2
3   x = 3;
4   y();
5   console.log(x);
6 }
7 
8 foo() // 2
9 x // 1