JavaScript函数和类实例

Js箭头函数

<h2>JavaScript 箭头函数</h2>

<p>IE11 及更早 IE 版本不支持箭头函数。</p>

<p id="demo"></p>

<script>
const x = (x, y) => { return x * y };
document.getElementById("demo").innerHTML = x(5, 5);
</script>

js传参

<p>计算所有参数之和：</p>
<p id="demo"></p>
<script>
function sumAll() {
    var i, sum = 0;
    for(i = 0; i < arguments.length; i++) {
        sum += arguments[i];
    }
    return sum;
} 
document.getElementById("demo").innerHTML =
	sumAll(1, 123, 500, 115, 44, 88);
</script>

js函数调用

call() 和 apply() 是预定义的函数方法。 两个方法可用于调用函数

<p id="demo"></p>

<script>
var myObject;
function myFunction(a, b) {
    return a * b;
}
myObject = myFunction.call(myObject, 10, 2);    // 返回 20
document.getElementById("demo").innerHTML = myObject; 
</script>

Js内包

<p>局部变量计数。</p>
<button type="button" onclick="myFunction()">计数!</button>
<p id="demo">0</p>
<script>
var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();
function myFunction(){
    document.getElementById("demo").innerHTML = add();
}
</script>

js类

<h2>JavaScript 类必须遵循严格模式 "strict mode" 的规则 </h2>
<p>JavaScript 类不能使用没有声明的变量。</p>
<p id="demo"></p>

<script>
class Runoob {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
  age() {
    let date = new Date(); // 正确
    return date.getFullYear() - this.year;
  }
}
myCar = new Runoob("yuan", 2022);
document.getElementById("demo").innerHTML =
"yuan " + myCar.age() + " 岁了。";
</script>

Js Gettter/Setter

<h2>JavaScript Class Gettter/Setter</h2>
<p>类中添加 getter 和 setter 使用的是 get 和 set 关键字。</p>
<p id="demo"></p>

<script>
class Yuan {
  constructor(name) {
    this.sitename = name;
  }
  get s_name() {
    return this.sitename;
  }
  set s_name(x) {
    this.sitename = x;
  }
}
let stu1 = new Yuan("yjj");
document.getElementById("demo").innerHTML = stu1.s_name;
</script>

Js静态方法

<h2>JavaScript 类的静态方法</h2>
<p>"noob" 对象可以作为参数传递给静态方法。</p>
<p id="demo"></p>

<script>
class Runoob {
  constructor(name) {
    this.name = name;
  }
  static hello(x) {
    return "Hello " + x.name;
  }
}
let noob = new Runoob("原");
document.getElementById("demo").innerHTML = Runoob.hello(noob);
</script>