Head First JavaScript笔记二

第四章：决策（选择）

1、if/else, switch/case，比较运算符，作用域；

第五章：循环

1、数组

var seats = [ false, true, false, true, true, true, false, true, false ];

2、for、break、continue、while

3、二维数组

第六章：函数

1、return语句结束函数、函数只能返回一块数据

2、重复代码绝非好事

3、回调函数，最常用于处理事件onclick()

4、使用函数引用联结事件，window.onload = initSeats; 创建与HTML分离的Javascript代码，但是不能传递参数；

5、函数字面量作为函数引用，而后从函数字面量内调用showSeatStatus()函数。

6、onload事件处理器是个初始化所有事件的绝佳地方；

7、回调函数被浏览器调用，以响应发生在脚本外的事情；函数引用能像变量般指派函数；函数字面量为无名函数，只调用一次；

第七章：表单与验证

1、访问表单数据，<input id="name" name="name" type="text" size="32" />，表单域有两种识别方式：ID或name属性，第一种使用getElementById()可以访问网页上任何元素；第二种针对表单设计，每个表单域都有一个form对象，它使用name属性设定标识符，form[“name”].value，每个表单域实际上是一个对象

2、一开始选择输入的域时，触发onfocus事件；当域不再被选择输入时，则触发onblur；当某个域不再被选择而且输入内容被改变时触发onchange事件；

3、onblur事件极度适合触发数据验证；

4、alert框是种很烦人的验证问题通知方式；

5、坏数据不该抵达服务器，在提交前最后一次验证表单；

6、正则表达式：专门设计用于匹配文本模式；正则表达式总是以斜线起始和结束；

7、元字符：用于连接字母与数字，创建高度描述性的文本模式；元字符乃是用于构建正则表达式的符号

• ‘.’ 匹配任何字符，换行符除外
• ‘\d’ 匹配任何数字字符
• ‘\w’ 匹配任何字母数字
• ‘\s’ 匹配空白字符，包括空格、tab、换行
• ‘^’匹配模式的字符串需以模式起始
• ‘$’字符串需以模式结束

8、深入正则表达式-限定符：不是元字符的任何文字“照样匹配”，另外一种正则表达式结构是限定符，限定符前为子模式，限定符应用于子模式，并控制子模式出现的次数

• ‘*’ 限定符前的子模式必须出现0或多次
• ‘+’ 限定符前的子模式必须出现1或多次
• ‘？’ 限定符前的子模式必须出现0或1次
• ‘{n}’   限定符前的子模式必须出现恰好n次
• ‘（）’几何字符或/和元字符，称为子模式

例如：/\w*/ 匹配任何字母数字字符，包括空字符；  /.+/ 任何字符均需出现一次以上，匹配非空字符串

9、正则表达式不是字符串；不能匹配除字符串外的数据；

10、javascript中利用正则表达式验证数据：

11、匹配最少次数与最多次数：限定符{ }可接受两个数字，分别指定子模式出现在字符串里的最少次数与最大次数；{min, max}

例如：/^\w{5,8}$/ 密码选择5-8个字符

12、元字符选替’|‘，让模式指定一连串可供选择的子模式；

例如：/(red|blue)pill/ 简易的二选一

13、从集合中匹配可选字符

例如：/d[iu]g/ 匹配“dig”

14、本章剩余代码，一些匹配函数

function validateZipCode(inputField, helpText) {
        // First see if the input value contains data
        if (!validateNonEmpty(inputField, helpText))
          return false;

        // Then see if the input value is a ZIP code
        return validateRegEx(/^\d{5}$/,
          inputField.value, helpText,
          "Please enter a 5-digit ZIP code.");
      }

      function validateDate(inputField, helpText) {
        // First see if the input value contains data
        if (!validateNonEmpty(inputField, helpText))
          return false;

        // Then see if the input value is a date
        return validateRegEx(/^\d{2}\/\d{2}\/(\d{2}|\d{4})$/,
          inputField.value, helpText,
          "Please enter a date (for example, 01/14/1975).");
      }

      function validatePhone(inputField, helpText) {
        // First see if the input value contains data
        if (!validateNonEmpty(inputField, helpText))
          return false;

        // Then see if the input value is a phone number
        return validateRegEx(/^\d{3}-\d{3}-\d{4}$/,
          inputField.value, helpText,
          "Please enter a phone number (for example, 123-456-7890).");
      }

      function validateEmail(inputField, helpText) {
        // First see if the input value contains data
        if (!validateNonEmpty(inputField, helpText))
          return false;

        // Then see if the input value is an email address
        return validateRegEx(/^[\w\.-_\+]+@[\w-]+(\.\w{2,3})+$/,
          inputField.value, helpText,
          "Please enter an email address (for example, johndoe@acme.com).");
      }

转载于:https://www.cnblogs.com/wlzblog/p/3193248.html