js的数据类型
-
stringnumberbooleanundefinednullobjectsymbol -
object中包含了functionArrayDate等
js判断类型方法
js中判断类型主要有三种方式，分别为：typeof instanceof Object.prototype.toString.call()
// typeof
typeof "abc" === "string" //true
typeof [] === "array" //false
typeof function () {} === "function" //true
//typeof 的返回值有：string, number, boolean, undefined, function, object
//instanceof
[] instanceof Array //true
"abc" instanceof String //true
//Object.prototype.toString.call()
Object.prototype.toString.call("abc") //[object String]
Get请求和Post请求的区别
Get请求：
- 参数拼接在url上
- 浏览器可以产生缓存
- 浏览器对get请求的url长度有限制
- 一般用于获取数据
Post请求：
- 数据包装在请求体中发送
- 一般用于提交表单
- 要比get安全性高些
闭包
- 什么是闭包？
闭包简单点说，就是返回一个函数，而这个函数保存了父作用域，此时父作用域不会被清除，此时就形成了一个闭包。闭包的作用很多，比如某些时候需要缓存一个结果，实现一个私有变量等等。 - 闭包实现的单例模式
const Sington = (function () {
let instance = null;
function F() {
if (instance) return instance;
instance = this;
}
F.getInstance = function () {
if (!instance) instance = this;
return instance;
}
return F;
})();
类的继承
// 说到继承，就需要一个基类
function Human(name, age) {
this.name = name;
this.age = age;
}
Human.prototype.say = function () {
console.log(`I am ${this.name}, ${this.age} years old.`);
}
- 原型链继承
function Man() {
this.gender = "man";
}
Man.prototype = new Human("a man", 30);
Man.prototype.constructor = Man;
new Man().say(); //I am a man, 30 years old.
new Man().gender; //man
- 构造方法继承
function Woman(name, age) {
Human.call(this, name, age);
this.gender = "woman";
}
new Woman("Tina", 26).say(); //此处报错，因为构造方法继承，只是继承了属性，而没有继承原型上的方法
//所以需要定义say方法
Woman.prototype.say = function () {
console.log(`I am ${this.name}, ${this.age} years old ${this.gender}.`);
}
new Woman("Tina", 26).say(); //I am Tina, 26 years old woman.
- 原型链和构造方法组合继承
/** 1.原型链继承
* 弊：
* a.不方便传递构造函数参数
* b.如果父类中含有引用类型的属性，则子类实例对其修改会对其他实例有影响
* c.子类的原型包含父类的一个实例，有点耗费资源
* 利：
* 既能继承属性又能继承原型
*
* 2.构造函数继承
* 弊：
* a.只能继承属性，不能继承原型
* 利：
* 方便传参；不存在引用修改影响问题；不存在浪费资源问题
*/
// 组合继承，结合两者优势，当然也会存在两者缺陷
function People(name, age) {
Human.call(this, name, age);
}
People.prototype = new Human();
People.prototype.constructor = People;
new People("Tom", 34).say(); //I am Tom, 34 years old.
- 寄生继承
function Personal(name, age) {
Human.call(this, name, age);
}
(function () {
function F() {} //中间宿主
F.prototype = Human.prototype;
Personal.prototype = new F();
Personal.prototype.constructor = Personal;
})();
new Personal("Jet", 99).say(); //I am Jet, 99 years old.
bind，apply，call
/** 三个方法都是改变当前环境中的this指向
* call, apply 调用后立即执行，但是参数不一样，第一个参数都是指定的this，其后的参数都是需要传递的参数，call通过逗号分隔，而apply传入数组
* bind 调用后返回一个一个待执行的方法，需要再次主动调用。参数值传递只需要指定的那个this
*/
var vn = "window";
function F() {
this.vn = "F";
}
var f = new F();
function say(name, ex) {
console.log(name + " say: " + this.vn + " is current this, " + ex);
}
//直接调用
say("Tom", "hahaha"); //Tom say: window is current this, hahaha
// call, apply
say.call(f, "Tom", "hahaha");
say.apply(f, ["Tom", "hahaha"]);
// bind
var say2 = say.bind(f);
say2("Tom", "hahaha");
实现一个深度克隆
var t = {
a: 1,
b: [1,2],
c: [{h: true, i: "abc"}],
d: {
x: 1,
z: function () {}
},
e: [1, {a:1}]
}
function copyDeep(obj) {
var result = obj instanceof Array ? [] : {};
for (var o in obj) {
if (obj[o] instanceof Array) {
result[o] = copyDeep(obj[o]);
} else if (o instanceof Object) {
result[o] = copyDeep(obj[o]);
} else {
result[o] = obj[o];
}
}
return result;
}
实现一个将原生的ajax封装成promise
const PromiseAjax = function (url) {
return new Promise((resolve, rejected) => {
const httpRequest = new XMLHttpRequest();
httpRequest.open("GET", url);
httpRequest.send();
httpRequest.onreadystatechange = text => {
if (httpRequest.readyState === 4 && httpRequest.status === 200) {
//处理成功
resolve(text);
}
if (httpRequest.readyState === 4 && httpRequest.status !== 200) {
//处理失败
rejected(text);
}
}
});
}
实现一个私有变量，用getName方法可以访问，不能直接访问
- Object.defineProperty方式
var test = {
id: 123,
name: 'Jaimor'
}
Object.defineProperty(test, 'name', {
});
- 自定义变量形式
function User(id) {
this.id = id;
const name = 'Jaimor';
this.getName = function () {
return name;
}
}
const test = new User(123);
console.log(test.id, test.getName(), test.name); //123, Jaimor, undefined
- 闭包方式
const Person = (function () {
let name = 'Tom';
return function (id, n) {
this.id = id;
name = n;
this.getName = _ => name
}
})();
箭头函数与普通函数的区别
- 普通函数：有原型，可以通过new创建一个实例，有自己的
this绑定。 - 箭头函数：
a) 箭头函数是匿名函数，不能作为构造函数，不能使用new。
b) 箭头函数不绑定arguments，可以使用...reset。
c) 箭头函数不绑定this，会捕获其所在的上下文的this作为自己的this值，同时callapplybind也不能改变this。
d) 箭头函数没有原型属性。
