《JavaScript设计模式》读书笔记(一)——函数怎么写才好

  当我阅读到这本书的时候,ES6已经出了,最新的教程应该是JS现代编程。虽然书中还是旧时的编码风格,但不妨碍我们获取思想。对于书中的代码,我会按照我自己的理解写出来。

从一个例子说起

现在你要完成一个表单验证任务(用户名,邮箱,密码)
像下面这样写当然没错:

    function checkName() {
        //验证姓名
    }

但这样写存在被别人写的同名方法覆盖的风险,你应该把他们放在类里面

 let CheckObject = {

        checkName  () {
            //验证姓名
            return this;
        },
        checkEmail  () {
            //验证邮箱
            return this
        },
    }
    CheckObject.checkName().checkEmail();
 /*你也可以这样写
    let CheckObject = function () {};
    CheckObject.prototype={
        checkName:function () {
            //验证姓名
        },
        checkEmail:function () {
            //验证邮箱
        },
    }
    */

书写函数尽量将其封装在类里面,因为你在工作中考虑的就不是你一个人写代码了,应该要考虑会不会影响到别人。

返回this可以让其链式调用,方便我们的使用。

值得一提的是,js里的this与Java中的不同

JS中的this

在JS里,this可用于任何函数(箭头函数没有自己的this),不受限制。它的值在代码运行时计算出来,取决于上下文。
需要警惕的是像下面这样调用

let user = {
  name: "John",
  hi() { alert(this.name); }
}

// 将赋值与方法调用拆分为两行
let hi = user.hi;
hi(); // 错误,因为 this 未定义

你可能会说,这我肯定会注意呀。但换成下面这样你可能就不太容易看出来了

let user = {
  name: "John",
  hi() { alert(this.name); },
  bye() { alert("Bye"); }
};

user.hi(); // John(简单的调用工作正常)

// 现在我们要根据 name 来决定调用 user.hi 还是 user.bye。
(user.name == "John" ? user.hi : user.bye)(); // 报错!

为啥会报错,因为this在传的时候没了,你相当于定义了一个新对象去调用它,它与user是不同的,完全独立,所以他没有this。

“旧时”的Var

var与let其实大体一样,但var没有块级作用域。什么意思呢?就是你如果不是在函数里声明的变量,那么他们都是全局变量。用var声明的变量只有函数作用域与全局作用域。

 function sayHi() {
        //等同于在最上面 var phrase
        phrase = "Hello";
        alert(phrase);
        var phrase;
    }
    sayHi();
    alert(phrase)//undef 找不到了,函数作用域里面的看不到了
    if(true)
    {
        var phrase="Hello"
    }
    alert(phrase);//还在

猜你喜欢

转载自www.cnblogs.com/AD-milk/p/12629997.html
今日推荐