JavaScript

在对象的内部新建函数属性

var person={
  first:"a",
  last:"b",
  full:function()
      {
          return this.first+this.last;
      }
};
document.write(person.full());

Js字符串模板

const name='Runoob';
const age=30;
const message=`${name} and ${age}`;
document.write(message);

Js标签

cars=["BMW","BenZ"];
//list是对于下面的代码块的标记
list:
{
     document.write(cars[0]);
     break list;//跳出已经标记的代码块
     document.write(cars[1]);
}

判断数据类型

function isDate(myDate){
    return myDate.constructor.toString().indexOf("Date")>-1;
}
document.write(isDate("111"));

正则表达式

在 JavaScript 中，正则表达式通常用于两个字符串方法 : search() 和 replace()。
search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。
replace() 方法用于在字符串中用一些字符串替换另一些字符串，或替换一个与正则表达式匹配的子串。

var str="abcd";
var n=str.search(/cd/i);
document.write(n);

在 JavaScript 中，RegExp 对象是一个预定义了属性和方法的正则表达式对象。我们可以利用它内置的test和exec方法来匹配字符串。

var patt=/e/;
document.write(patt.test("accd"));
document.write(patt.exec("aeee"));

JS作用域

在每个代码块中 JavaScript 不会创建一个新的作用域，一般各个代码块的作用域都是全局的。
以下代码的的变量 i 返回 10，而不是 undefined：

for (var i = 0; i < 10; i++) {
    // some code
}
return i;

检测数字大小

function validate(){
    var x,text;
    x=document.getElementById("numb");
    if(isNaN(x)||x<1||x>10){
        text="输入错误";
    }else{
        text="输入正确";
    }
    document.getElementById("demo").innerHTML=text;
}

验证相关API

HTMLSelectElement.checkValidity() 会检查元素是否有任何输入约束条件，并且检查值是否符合约束条件。 如果值是不符合约束条件的，浏览器就会在该元素上触发一个可以撤销的 invalid事件。

function test(){
    var x=document.getElementById("nu");
    x.setCustomValidity("");
    if(x.checkValidity()==false){
        x.setCustomValidity("输入错误");
        document.getElementById("demo").innerHTML=x.validationMessage;
    }else{
        x.setCustomValidity("输入正确");
        document.getElementById("demo").innerHTML=x.validationMessage;
    }
}

This关键字

在JS中，this一般指的是全局对象。在对象内部的函数（方法）中，this指的是当前的对象。JS可以用相关的函数切换上下文（this所指向的对象）
使用 person2 作为参数来调用 person1.fullName 方法时, this 将指向 person2, 即便它是 person1 的方法

var person1 = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}
var person2 = {
  firstName:"John",
  lastName: "Doe",
}
person1.fullName.call(person2);  // 返回 "John Doe"

let&var

let作用在块当中，其作用域仅仅为块。而如果把var定义在块当中，其作用域是全局。此外，使用var定义的变量，相当于window对象的属性，可以采用window.xxxx进行调用

var carName = "Volvo";
// 可以使用 window.carName 访问变量

JS异步编程

以下的代码demo1相关的脚本会异步执行，demo2相关的脚本会在主线程下执行

setTimeout(function(){
    document.getElementById("demo1").innerHTML="RUNOOB";
}，3000);
document.getElementById("demo2").innerHTML="RUNOOB2";

JS计时事件

setInterval用于多次调用某一函数，可以设置每次调用的时间间隔。clearInterval可以停止函数的调用。

var myVar=setInterval(function(){timer()},1000);//每一秒调用一次函数
function timer(){
    var d=new Date();
    var t=d.toLocaleTimeString();
    document.write(t);
    // console.log(t);
}
function stop(){
    clearInterval(myVar);//停止每秒一次的函数调用
}

Cookie

function checkCookie(){
    var name=getCookie("username");
    if(user!=""){
        alert("welcome"+name+"visit again.");
    }else{
        name=prompt("please input your name:","");
        if(name!=null&&name!=""){
            setCookie("username",name,30);
        }
    }
}
function setCookie(cname,cvalue,exdays){
    var d=new Date();
    d.setTime(d.getTime()+(exdays*24*3600*1000));
    var expires="expires="d.toGMTString();
    document.cookie=cname+"="+cvalue+";"+expires;
}

function getCookie(cname){
    var name=cname+"=";
    var ca=document.cookie.split(';');
    for(var i=0;i<ca.length;i++){
        var c=ca[i].trim();
        if(c.indexOf(name)==0){
            return c.substring(name.length,c.length);
        }
    }
    return "";
}

异步函数

异步函数 async function 中可以使用 await 指令，await 指令后必须跟着一个 Promise，异步函数会在这个 Promise 运行中暂停，直到其运行结束再继续运行。
其中resolve可以通过then来传递异步执行成功后的结果，reject显示异步执行失败的信息。

function print(delay,message){
    return new Promise(function (resolve,reject){
       setTimeout(function(){
           console.log(message);
           resolve();
       },delay); 
    });
}

async function asyncFunc(){
    await print(1000,"1");
    await print(2000,"2");
}