※剩餘參數
window.onload = () => {
restParam('a','b','c');
}
function restParam(...str) {
for(let s of str) alert(s);
}
※限制參數
限制最多幾個參數window.onload = () => {
RestrictionParam(); // undefined-undefined
RestrictionParam('a','b'); // a-b
RestrictionParam('a','b','c'); // a-b
}
function RestrictionParam(...[p1, p2]) {
alert(p1 + '-' + p2);
if(typeof(arguments[2]) != 'undefined'){
alert(arguments[2]);
}
}
※實際上沒有真的限制，只是傳進來不用
※...在變數的前面，和java相反
※...只能寫在參數的最後，和 java 一樣
※...傳進來的參數，可以是不同型態
※傳參數但不用
function test(){
for(var i=0; i<arguments.length; i++){
alert(arguments[i]);
}
for(i in arguments){
alert(arguments[i]);
}
}
----------
<button onclick="test('a', 'b')">f1</button>
※使用arguments還是可取得參數
※匿名function
<button onclick="(function(){alert(arguments[0])})('a')">f1</button>
<button onclick="(function(p1){alert(p1)})('a')">f2</button>
※兩種方式都可以
※這種匿名外面有圓括號，就是「(function xxx)()」最外層的圓括號，最後的圓括號是傳進去的值
※巢狀function
※無參數
function outer(){
function inner(){
return 1;
}
/*
var inner = function(){
return 1;
}
*/
return inner;
// return inner();
}
----------
<button onclick="alert(outer())">f1</button>
<button onclick="alert(outer()())">f2</button>
※inner兩種方式我測的結果都一樣
※return有沒有加「()」有差
沒加時，f1按鈕是inner整個function；f2按鈕是1
有加時，f1按鈕是1；f2失效
※有參數
function outer(p1){
function inner(p2){
return p2;
}
return inner(p1);
}
----------
<button onclick="alert(outer(2))">f1</button>
<button onclick="alert(outer(2)())">f2</button>
※有參數時，呼叫outer當然沒問題，但裡面要傳參數到內部的inner參數時，一定要有「()」，所以外面(button)無法呼叫到裡面的inner，也就是說inner function只供outer使用
※內外層互動
function outer(p1, p2){
function inner(p3 ,p4){
return p3 * p4;
}
return inner(p1, p2) + p1 + p2;
}
----------
<button onclick="alert(outer(1, 2))">f1</button>
※當然還是不能直接呼叫內部function，inner function只供outer使用
※內外層變數
var x = "xxx";
function outer(){
var x = "ooo";
/*
var inner = function(){
return x;
}
*/
var inner = new Function("return x;");
return inner;
}
----------
<button onclick="alert(outer())">f1</button>
<button onclick="alert(outer()())">f2</button>
※正常情形是抓最近的變數，但用new Function只會抓全域的，所以將全域的刪除，裡面new Function也不會抓到
※四種寫法
function f1(x){
alert(x);
}
var f2 = new Function('x', 'alert(x);');
var f3 = function(x){
alert(x);
}
var f4 = (x) => {
alert(x);
}
----------
<button onclick="f1('F1')">f1</button>
<button onclick="f2('F2')">f2</button>
<button onclick="f3('F3')">f3</button>
<button onclick="f4('F4')">f4</button>
※f2的最後一個參數一定是內容就對了，換句話說，如果不放參數，那內容就是第一個
※f4是lambda的寫法，我用IE11了，都還是不支援，而且還會導致其他的function出錯，所以IE不要去用它
※f4可以說是從f3改的，放在f1和f2都不行
※還有匿名寫法，例如就把f1拿掉，就是了，要用時就整個搬到呼叫的方法即可
※箭頭函數沒有 this、super、arguments、new.target
※除了 f1 的寫法外，其他三種寫法，函數名稱一樣，會後者蓋前者，f1 只要名稱一樣，就會最先被蓋過去
※箭頭函數省略寫法
<script>
'use strict';
window.onload = _ => {
alert(xxx(9));
ooo(8);
}
let xxx = x => {
return x;
}
let ooo = o =>
alert(o);
</script>
※1.如果沒有參數，除了「() =>」，還可以用「_ =>」
2.如果只有一個參數，可以省略「()」
3.如果只有一行，可以不用「{}」，但如果有回傳值，連「return」關鍵字也不能有
※一般函數和箭頭函數比較
※this
<script>
'use strict';
window.onload = () => {
let o = new Obj('x');
alert(o.p);
}
function Obj(p) {
this.p = p;
return p;
}
/*
let Obj = (p) => {
this.p = p;
return p;
}
*/
</script>
※
※arguments
<script>
'use strict';
window.onload = () => {
xxx(9,8);
}
function xxx() {
alert(arguments.length);
}
/*
let xxx = () => {
alert(arguments.length);
}
*/
</script>
※
※new.target
<script>
'use strict';
window.onload = _ => {
Foo();
new Foo();
// x();
// new x();
}
function Foo() {
alert(new.target);
if(typeof(new.target) == 'undefined'){
alert('non constructor');
} else {
alert('is constructor');
}
}
/*
let x = _ => {
alert(new.target);
}
*/
</script>
※使用 new.target 可以知道是不是用 new 的方式進來的
※new.target.name
<script>
'use strict';
window.onload = _ => {
new Father(); // Father
new Me(); // Me
}
class Father {
constructor() {
alert(new.target.name);
}
}
class Me extends Father {
constructor() {
super();
}
}
</script>
※
※立刻執行的函數
( function() {alert("一");} )();
( function() {alert("二");} ());
new function() {alert("三");} ();
new Function("alert('四');") ();
( () => {alert("五");}) ();
+ function() {alert("1");} ();
- function() {alert("2");} ();
! function() {alert("3");} ();
~ function() {alert("4");} ();
※不需要呼叫，自己就執行了，中間可不用空格，只是方便對照而已
※如果有參數，參數值可以寫在最後面的圓括號裡
