ES5
1.声明脚本
2.DOM与BOM
DOM(Document Object Model)指文档对象模型。
BOM(Borwser Object Model)指浏览器对象模型。PS:DOM基本操作
查找节点 document.getElmentById
创建节点 element.creatElement,document.body.appendChild
删除节点 element.remove
修改节点 element.setAttributeNode
windows.top指顶端对象。
windows.parent指父对象。
3.var与不var的区别
//表示全局变量var a = 89function test() { //全局变量a重新赋值。 // a = 80 //函数内部定义一个变量a var a = 80 console.log(a)}test()console.log(a)
PS:js是弱数据类型,意思是不需要指定数据类型是什么,数据类型是由js引擎决定的。
4.js 比较运算符
console.log(2 > 1) //trueconsole.log(6 < 2) //falseconsole.log(2 <= 4) //trueconsole.log(2 >= 4) //false//==比较值是否相等,需要自动转换类型再比较。//===精准比较值与类型是否相等,不需要自动转化类型再比较。console.log('2' == 2) //trueconsole.log('2' === 2) //falseconsole.log('2' != 2) //falseconsole.log('2' !== 2) //true//null是引用为空时(如对象)//undefined是数值为空时(如普通变量)console.log(typeof null) //objectconsole.log(typeof undefined) // undefinedconsole.log(null == undefined) //true,因为null是空白的对象引用,空白的对象引用就等于没有定义,所以相等。console.log(null === undefined) //false,因为null是null类型,undefined是undefined类型,类型不匹配,所以不相等。
5.js逻辑运算符
var expr = 1//expr表达式为(null、NaN、0、''、undefined)会转为falseif (expr) { console.log(true)} else { console.log(false)}// truevar expr1 = 1var expr2 = 1// &&、||、!、!! 逻辑运算符,逻辑运算符结果类型不一定是boolean,可以是任意类型。console.log(expr1 && expr2) // 1。// &&、|| 具有短路功能,第一个表达式不满条件(false),后面的表达式将被忽略。console.log(true && false) //falseconsole.log(false && true) //falseconsole.log(false || true) //trueconsole.log(true || false) //true// !、!! 逻辑运算符console.log(!true) // falseconsole.log(!!true) // true// &、| 既是逻辑运算符,也是位运算符(按位操作符)。console.log(true & false) //0,false 转换为 0,true 转换为 1,0 & 1 = 0console.log(true | false) //1
5.js中this关键字
this用法等于public(全局)
function Person(){
var name ="abc";//私有 this.name ="abd3"//共有 }this指向上一个对象,最后调用的的对象。
6.js闭包
闭包就是能够读取其他函数内部变量的函数。外部是不能访问函数内部的。
7.prototype和__proto__区别
prototype是只属于function的,显式属性,而__proto__属于所有object的,隐式属性。
function的prototype属性表示该function所创建的对象的原型。
PS:构造器其实就是一个普通的函数。当使用 new 操作符来作用这个函数时,它就可以被称为构造方法(构造函数)。
funtion的引用就是原型。
原型指向自己的原型(prototype)所形成一级一级的链结构就是原型链。
8.编码转化
//将字符串转换成URL编码var myString = 'hello all'var code = encodeURI(myString)var str = decodeURI(code)console.log(code) //hello%20allconsole.log(str) //"hello all"
10.js innerhtml 与outerhtml区别
innerhtml 设置或获取位于对象起始和结束标签内的 HTML
如:<div><span>innerhtml</span></div>
outerhtml 设置或获取对象及其内容的 HTML 形式
如:<div><span>innerhtml</span></div>
12.js中的document对象与window对象区别
document当前页面所有的,包括超出的部分。
window当前窗口所有的,超出的部分不计。
13.js性能优化
能用原生js就用js代码写,减少js库(jquery)依赖。
避免使用 with 关键字与eval() 函数。(不精准定位查询,整体遍历查询,耗资源)。
将重复的表达式赋值精简到最小 (建议使用三目运算符)。
在复杂对象中使用索引来查找数组 (快速定位,节约查询时间)。
少用 document.write()函数(文档流输入输出也是很占资源的)。
15.js的严格模式
在函数里面加"use strict";
比如:使用严格模式下,变量都必须先用var命令声明,然后再使用。
好处就是保证代码的严谨性。(慎用)
16.js代码懒加载
<script>
var script = document.createElement ("script");
script.type = "text/javascript"; script.src = "script.js"; document.getElementsByTagName("head")[0].appendChild(script);</script>
优点:无阻塞,异步加载js代码快。
17.自动创建函数并运行
无参数
(function(){
var a = 1;
var b = 2;
alert(a+b);
})();
有参数
(function(a,b){
var result = a+b;
return result;
})(1,2);
PS:匿名函数:没有定义方法名的函数。
如:function (){
};
有名函数:定义方法名的函数。
如:function aa(){
};
_xxx(){} //一种编程风格,表示私有。
18.链式调用(jquery为例)
如:$("p").append("文本颜色").css("color","red");
19.call与apply、bind区别
call() 调用一个对象的一个方法,以另一个对象替换当前对象。 ( 我替换别人的方法)
apply() 应用某一对象的一个方法,用另一个对象替换当前对象。 (别人的方法交给我去使用)
bind() 创建一个新函数,把新函数的tihs传给指定对象。
PS:es6中使用箭头函数取代bind()。
20.setInterval与setTimeout区别
setTimeout超时执行一次。
setInterval每隔一段时间执行一次。
21.typeof与instanceof区别
instanceof 判断对象的原型链是否存在于某个构造函数prototype属性上,返回一个布尔型。
typeof 判断数据类型,返回一个字符串,返回值为"number"、"string"、"boolean"、"object"、"function" 和 "undefined"。
PS:简单类型使用typeof,复杂类型使用instanceof,因为typeof无法确定引用对象中具体类型。
[] instanceof Array; // true
typeof []; //object
22.js作用域
全局变量和局部变量。
23.target与currentTarget区别
target一般指当前元素点击事件流。
currentTarget一般指当前元素的父元素事件流。
24.ajax缓存
请求一些长期不变的数据可以缓存起来,提高的页面性能。比如城市级联的数据。
PS:get 请求适合采用缓存。
25.html调用js方法。
26.回调地狱 (callback-hell)。
指嵌套过多的回调函数。(这里讲的回调函数一般指http请求的回调函数,等待数据请求回来才执行的函数)
如:getData(function(x){
A();//函数A执行完,会被垃圾回收器回收内存。var c=A(); //不会被回收,变量c引用函数A。c=null // 变量c置空,函数A就会被垃圾回收器回收内存
补充:
1.js递归函数。(自己调用自己)
如:function count(i) {
PS: 递归函数一定要添加判断条件,否则就会报错出现内存溢出问题。
斐波那契数列(这个数列从第3项开始,每一项都等于前两项之和,即1, 1, 2, 3, 5, 8, 13)
举例:求第四项的值
var num1 = 1;
var num2 = 1;
for(var i = 3; i <= 4; i++) {
var temp = num2;
console.log("第" + (i - 2) + "次,temp=" + temp)
num2 = num1 + num2;
console.log("第" + (i - 2) + "次,num2=" + num2)
num1 = temp;
console.log("第" + (i - 2) + "次,num1=" + num1)
}console.log("结果,num2=" + num2);
2.js数字格式化(加逗号)
//方法一,使用正则表达
function changeNum(num) {
return (num || 0).toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'); }//方法二,使用循环
function changeNum(num) {
var result = '', counter = 0; num = (num || 0).toString(); for (var i = num.length - 1; i >= 0; i--) { counter++; result = num.charAt(i) + result; if (!(counter % 3) && i != 0) {result = ',' + result;
}
} return result; }