输出

使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中。
使用 innerHTML 写入到 HTML 元素。
使用 console.log() 写入到浏览器的控制台。

字面量

在编程语言中,一般固定值称为字面量,如 3.14。
数字(Number)字面量 可以是整数或者是小数,或者是科学计数(e)。
字符串(String)字面量 可以使用单引号或双引号。
表达式字面量 用于计算。
数组(Array)字面量 定义一个数组。
对象(Object)字面量 定义一个对象。
函数(Function)字面量 定义一个函数。

对象对象:
对象由花括号分隔。在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔:

var person={firstname:"John", lastname:"Doe", id:5566};

Undefined 和 Null

var person = null;           // 值为 null(空), 但类型为对象
var person = undefined;     // 值为 undefined, 类型为 undefined

null不会清空类型,undefined会清空类型

字符串

1.字符串可以是插入到引号中的任何字符。你可以使用单引号或双引号
2.可以使用内置属性 length 来计算字符串的长度
3.在 JavaScript 中,字符串写在单引号或双引号中。
因为这样,以下实例 JavaScript 无法解析:

"We are the so-called "Vikings" from the north."

可以使用反斜杠 () 来转义 “Vikings” 字符串中的双引号,如下:

"We are the so-called \"Vikings\" from the north."

4.javascript中“===” 为绝对相等,即数据类型与值都必须相等。
5.字符串中的方法命名很多和java中的相同,具体再查表,这里不罗列
6.字符串的换行需要用反斜杠()

var x = "Hello \
World!";

for/in遍历


var person={fname:"John",lname:"Doe",age:25}; 
 
for (x in person)  // x 为属性名
{
    txt=txt + person[x];
}

typeof

你可以使用 typeof 操作符来检测变量的数据类型

typeof "John"                // 返回 string 

正则表达式

1.search()方法:查找字符串中指定正则表达式的位置
2.replace()方法:将字符串中指定正则表达式的部分替换为另一个字符串,并返回结果作为函数返回值
3.test()方法:测试某字符串是否与某正则表达式相匹配

bool类型

表达式值为0为false,表达式值为非0为true

程序块作用域

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

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

表单验证

1.自动验证:如果表单字段 (fname) 的值为空, required 属性会阻止表单提交
2.邮箱验证:

function emailCheck(){
    var email = document.forms["myForm"]["email"].value;
    var index1 = email.indexOf("@");
    var index2 = email.lastIndexOf(".");
    if(index1 < 1 || index2 < index1 + 2 || index2 + 2 > email.length){
        document.getElementById("emailAlert").innerHTML = "非法邮箱";
        return false;
    }
    return true;
}

this关键字

在方法中,this 表示该方法所属的对象。
如果单独使用,this 表示全局对象。
在函数中,this 表示全局对象。
在函数中,在严格模式下,this 是未定义的(undefined)。
在事件中,this 表示接收事件的元素。
类似 call() 和 apply() 方法可以将 this 引用到任何对象。
注意 this 是保留关键字,你不能修改 this 的值。

let和const

var声明的变量不具备块级作用域的性质,如:

var x = 10;
// 这里输出 x 为 10
{ 
    var x = 2;
    // 这里输出 x 为 2
}
// 这里输出 x 为 2

这样重复定义的话,第二次声明会覆盖第一次的,这里可以使用let,定义的范围就是块级作用域的,所以循环遍历用let比较好

for(let i = 0; i < 5; i++){...}

const声明的常量并非是真的常量,const 可以定义一个变量能调用的不变的值

JSON

JSON.parse():用于将一个 JSON 字符串转换为 JavaScript 对象。
JSON.stringify():用于将 JavaScript 值转换为 JSON 字符串。

href="#"与href="javascript:void(0)"的区别

arguments对象

argument 对象包含了函数调用的参数数组。通过这种方式你可以很方便的找到最大的一个参数的值


x = findMax(1, 123, 500, 115, 44, 88);
 
function findMax() {
    var i, max = arguments[0];
    
    if(arguments.length < 2) return max;
 
    for (i = 0; i < arguments.length; i++) {
        if (arguments[i] > max) {
            max = arguments[i];
        }
    }
    return max;
}

DOM对象

查找HTML元素
getElementById():通过id查找HTML元素
getElementByTagName():通过标签名字查找
getElementByClassName():通过类名字查找

改变HTML
document.write():用于直接向 HTML 输出流写内容
改变HTML元素内容:document.getElementById(id).innerHTML=新的 HTML
改变HTML元素属性:document.getElementById(id).attribute=新属性值

改变CSS

document.getElementById(id).style.property=新样式

事件:
onload和onunload:进入和离开页面的时候触发

元素(结点)

在进行结点操作之前都必须先创建好新的HTML元素结点

appendChild():
1.在已经存在的元素后面添加某元素
2.创建新的HTML元素结点

insertBefore():将新元素添加到开始位置

removeChild():移除一个元素(你需要知道这个元素的父元素)

replaceChild():替换一个元素

HTML collection
getElementsByTagName() 方法返回 HTMLCollection 对象。
以下代码获取文档所有的 <p> 元素:

var x = document.getElementsByTagName("p");

访问第二个元素可以用下面的方法:

   y = x[1]; 

HTMLCollection 对象的 length 属性定义了集合中元素的数量。

注意:
HTMLCollection 不是一个数组!HTMLCollection 看起来可能是一个数组,但其实不是。
你可以像数组一样,使用索引来获取元素。HTMLCollection 无法使用数组的方法: valueOf(), pop(), push(), 或 join() 。

HTMLCollection 与 NodeList 的区别

HTMLCollection 是 HTML 元素的集合,NodeList 是一个文档节点的集合,NodeList 与 HTMLCollection 有很多类似的地方。
NodeList 与 HTMLCollection 都与数组对象有点类似,可以使用索引 (0, 1, 2, 3, 4, …) 来获取元素。
NodeList 与 HTMLCollection 都有 length 属性。
HTMLCollection 元素可以通过 name,id 或索引来获取。
NodeList 只能通过索引来获取。
只有 NodeList 对象有包含属性节点和文本节点。

javascript对象

这个例子创建了对象的一个新实例,并向其添加了四个属性:

person=new Object();
person.firstname="John";
person.lastname="Doe";
person.age=50;
person.eyecolor="blue"; 

替代语法(使用对象 literals):

person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"}; 

一旦您有了对象构造器,就可以创建新的对象实例,就像这样:

var myFather=new person("John","Doe",50,"blue");
var myMother=new person("Sally","Rally",48,"green");

JavaScript for…in 语句循环遍历对象的属性。

定义完结构对象以后,可以通过prototype在结构函数外为结构体新增属性

/*
利用prototype给Person的构造函数添加新的属性
*/
Person.prototype.name = function(){
//firstName和secondName为person对象的两个属性
    return this.firstName + this.secondName;
}

数字对象

1.javascript的数字对象均为64位
2.如果前缀为 0,则 JavaScript 会把数值常量解释为八进制数,如果前缀为 0 和 “x”,则解释为十六进制数。

var y = 0377;
var z = 0xFF;

所以,绝对不要在数字前写零,除非你需要进行八进制转换
3.可以用toString() 方法输出16进制,8进制,2进制。

var myNumber=128;
myNumber.toString(16);   // 返回 80
myNumber.toString(8);    // 返回 200
myNumber.toString(2);    // 返回 10000000

4.无穷大:当数字运算结果超过了JavaScript所能表示的数字上限(溢出),结果为一个特殊的无穷大(infinity)值,在JavaScript中以Infinity表示。同样地,当负数的值超过了JavaScript所能表示的负数范围,结果为负无穷大,在JavaScript中以-Infinity表示。无穷大值的行为特性和我们所期望的是一致的:基于它们的加、减、乘和除运算结果还是无穷大(当然还保留它们的正负号)。

5.NaN 属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。你可以使用 isNaN() 全局函数来判断一个值是否是 NaN 值。

String 对象

length属性:返回string对象的长度
indexOf():定位字符串中某一个指定的字符首次出现的位置,没找到返回-1
match():查找字符串中特定的字符,找到返回这个字符,没找到就返回null
toUpperCase() / toLowerCase():大小写转换
split()把字符串转换为数组

Date对象

new Date():获取当前日期

数组对象

javascript中的数组对象支持存放不同类型的对象,可以调用数组的内置的对象来实现一些效果:length返回数组的长度,indexof()返回指定对象在数组中的索引

合并两个数组 - concat()
合并三个数组 - concat()
用数组的元素组成字符串 - join()
删除数组的最后一个元素 - pop()
数组的末尾添加新的元素 - push()
将一个数组中的元素的顺序反转排序 - reverse()
删除数组的第一个元素 - shift()
从一个数组中选择元素 - slice()
数组排序(按字母顺序升序)- sort()
数字排序(按数字顺序升序)- sort()
数字排序(按数字顺序降序)- sort()
在数组的第2位置添加一个元素 - splice()
转换数组到字符串 -toString()
在数组的开头添加新元素 - unshift()

浏览器对象模型(BOM)

window.open():打开新页面
window.close():关闭当前页面
screen.availWidth:返回屏幕可用宽度
screen.availHeight:返回屏幕可用高度
location.href:返回当前页面url
location.pathname:返回页面url路径名
location.assign(url):加载新的文档,也可以跳到别的页面
history.back() :加载历史列表中的前一个 URL
history.forward():加载历史列表中的下一个 URL

弹窗

警告框:alert()
确认框:confirm()(返回值为按下的按钮)
提示框:prompt()(返回值为输入的值)

计时

setInterval() - 间隔指定的毫秒数不停地执行指定的代码。
setTimeout() - 在指定的毫秒数后执行指定代码。

function myTimer(){
    var d=new Date();
    var t=d.toLocaleTimeString();
    document.getElementById("demo").innerHTML=t;
}
function myStopFunction(){
    clearInterval(myVar);
}
function myFunction()
{
    myVar=setTimeout(function(){alert("Hello")},3000);
}
 
function myStopFunction()
{
    clearTimeout(myVar);
}