js基础知识总结
变量类型及计算
问题:
1.js中使用type of能用到哪些变量
2.何时使用===何时使用==
3.js中有哪些内置函数
4.js变量按照存储方式分为哪些类型,并描述其特点
5.如何理解json
6.内置对象
解答:
1.符串(String)、数字(Number)、布尔(Boolean)、未定义(Undefined)、函数(其实为一个引用类型,非常特殊类型)
(function)Object[数组([]Array)、对象({}Object)、空(Null)、]。可见对于引用类型typeof并不能详细指明其类型,但是值类型可以。
2.obj,a==null相当于obj.a===null||obj.a===undefined
用双等情况:1)查看属性是否存在、2)函数中查看参数是否存在
3.内置函数(不考虑其环境9个)Object、Array、Boolean、Number、String、Function、Date、RegExp、Error
4.值类型(一个变量一个内存)、引用类型(好几个变量共用一个内存)
5.json也是一个Js对象(同math),也是一种数据格式
常用api:
json.stringify({a:10,b:20})对象转换成字符串
json.parse('{"a":10,"b",20}')字符串转换成对象
6.json、Math都为内置对象
原型与原型链
问题
1.如何准确判断一个变量是数组类型
2.写一个原型链继承的例子
3.描述New一个对象的过程
4.zepto(或者其他框架)源码中如何使用原型链
解答
-
var arr=[]; arr instanceof Array //true2.eg1:贴近于实战eg1
function Animal(){ this.eat=function(){ console.log("animal can eat"); } } function Dog(){ this.bark=function(){ console.log('dog bark') } } Dog.prototype=new Animal();//就是一个对象,相当于实例化了一个没名字的对象 var hashiqi=new Dog(); console.log(hashiqi.eat)
eg2:
function User() {
this.name = "zhangsan";
}
User.prototype.getName = function() {
return this.name;
}
function Student() {
this.age = 20;
}
Student.prototype = new User();
//子类型有时候需要重写超类型中的某个方法,或者需要添加母类型中不存在的某个方法。但不管怎样,给原型添加方法的代码一定要放在替换原型的语句之后。
Student.prototype.getAge = function() {
return this.age;
}
var x = new Student();
console.log(x.getName());
console.log(x.getAge());
eg3:封装dom查询的一个例子
//构造函数
function Elem(id) {
// this.elem=document.getElementById(id);
this.elem = document.getElementsByClassName(id)[0];
}
Elem.prototype.html = function(val) {
var elem = this.elem;
if (val) {
elem.innerHTML = val;
return this; //方便链式操作
} else {
return elem.innerHTML;
}
};
Elem.prototype.on = function(type, fn) {
var elem = this.elem;
elem.addEventListener(type, fn); //该函数为原生的
return this;
}
var div1 = new Elem('ctrl');
div1.html('<p>hello mooc</p>').on('click', function() {
alert('clicked');
}).html('<p>hello mooc nihao</p>')
3.创建一个新对象:this指向这个新对象,执行代码时,即对this赋值(属性等),返回This
4.阅读源码是高效提高技能的方式(读个小的框架)但不能“埋头苦读”有技巧在其中,搜下结构如慕课网搜索"zapto设计和源码分析"
作用域与闭包
问题
1.说一下变量提升的理解
2.说明This几种不同的使用场景
3.创建10个<a>标签,点击的时候弹出来对应的序列号
4.如何理解作用域
5.实际开发中的闭包应用
解题:
1.变量的提升:执行上下文中首先变量定义,函数声明(与函数表达式的区别)
2.作为构造函数(this为实例对象)、对象属性(this.name,this为普通对象)、普通对象(this为window)、在call apply bind改变。
- for (var i = 0; i < 10; i++) {
(function(i) {
var a = document.createElement('a');
a.innerHTML = i + '
';
document.body.appendChild(a);
a.addEventListener('click', function(e) {
e.preventDefault(); //取消默认事件,指a标签
alert(i);
});
})(i);
}
4.如何理解作用域:自由变量、作用域链,即自由变量的查找,闭包的场景
5.实际应用:封装变量,收敛权限
异步与单线程
问题
1.同步与异步的区别,举一个同步与异步的例子
2.一个settimeout的笔试
3.前端异步开发的例子
解答:
1.同步会阻塞代码执行,而异步不会,alert()同步,setTimeout()为异步
2.一个settimeout的笔试
console.log(1);
setTimeout(function(){console.log(2)},0) ;
console.log(3);
setTimeout(function(){console.log(4)},1000);
console.log(5);//1 3 5 2 4
