ES6 classes VS ES5 Function
典型的 ES5 的类(function)在继承、构造和方法定义方面可读性较差,当需要继承时,优先选用 classes
ES5 function
@H_502_8@/** * 结果层错误 * @type {ResultError} */ var ResultError = exports.ResultError = function(errcode,errmsg) { this.errcode = errcode; this.errmsg = errmsg; } ResultError.prototype.toString = function() { return this.errmsg; }//抛出<a href="/tag/cuowu/" target="_blank" class="keywords">错误</a>信息
exports.generateErr = function(errcode,errmsg) {
var errObject = new ResultError(errcode,errmsg);
return errObject;
}
ES6 classes
@H_502_8@class Animal { constructor(age) { this.age = age }move() { / ... / }
}class Mammal extends Animal {
constructor(age,furColor) {
super(age)
this.furColor = furColor
}liveBirth() { / ... / }
}class Human extends Mammal {
constructor(age,furColor,languageSpoken) {
super(age,furColor)
this.languageSpoken = languageSpoken
}speak() { / ... / }
}
Classes
super
super 关键字用于调用一个对象的父对象上的函数。
//语法
super([arguments]);
// 调用 父对象/父类 的构造函数
super.functionOnParent([arguments]);
// 调用 父对象/父类 上的方法
- 在使用this关键字之前必须调用super()方法 (true)
- 只能在子类中调用super()函数
- 如果你在子类中定义了构造函数,你必须调用super()方法
- 如果你没有指定构造函数,super()方法也会自动为你调用
return
return立即返回函数
在使用 return 语句时,函数会停止执行,并返回指定的值。例如:
@H_502_8@sayHi(); function sayHi(name,message){ document.write("return 语句执行前。"); return; alert("hello" + name +"," + message);//这一行永远不会被调用 }
return用在前端页面
在js中return false的作用一般是用来取消默认动作的。比如你单击一个链接除了触发你的 onclick时间(如果你指定的话)以外还要触发一个默认事件就是执行页面的跳转。所以如果 你想取消对象的默认动作就可以return false。
@H_502_8@<script type="text/javascript">
function fun(){
location.href="http://www.sina.com.cn";
return false;
}
单击超链接后会跳转到新浪而不会跳转到百度,如果没有renturn false 则会跳转到百度
return一个对象出去
/*抛出错误信息*/
exports.generateErr = function(errcode,errmsg);
return errObject;
}
try...catch
Unconditional catch clause
try {
throw 'myException'; // generates an exception
}
catch (e) {
// statements to handle any exceptions
logMyErrors(e); // pass exception object to error handler
}
try {
myroutine(); // may throw three types of exceptions
} catch (e if e instanceof TypeError) {
// statements to handle TypeError exceptions
} catch (e if e instanceof RangeError) {
// statements to handle RangeError exceptions
} catch (e if e instanceof EvalError) {
// statements to handle EvalError exceptions
} catch (e) {
// statements to handle any unspecified exceptions
logMyErrors(e); // pass exception object to error handler
}
Returning from a finally block
(function() {
try {
try {
throw new Error('oops');
}
catch (ex) {
console.error('inner',ex.message);
throw ex;
}
finally {
console.log('finally');
return;
}
}
catch (ex) {
console.error('outer',ex.message);
}
})();
// Output:
// "inner" "oops"
// "finally"
使用 try catch 的使用无论是在 try 中的代码还是在 catch 中的代码性能消耗都是一样的。
需要注意的性能消耗在于 try catch 中不要直接塞进去太多的代码(声明太多的变量),最好是吧所有要执行的代码放在另一个 function 中,通过调用这个 function 来执行。
针对第二点,可以查看 ECMA 中关于 try catch 的解释,在代码进入 try catch 的时候 js引擎会拷贝当前的词法环境,拷贝的其实就是当前 scope 下的所有的变量。
JS对象的复制
深复制和浅复制最根本的区别在于是否是真正获取了一个对象的复制实体,而不是引用,
1)深复制在计算机中开辟了一块内存地址用于存放复制的对象,
2)而浅复制仅仅是指向被复制的内存地址,如果原地址中对象被改变了,那么浅复制出来的对象也会相应改变。
所谓的浅复制,只是拷贝了基本类型的数据,而引用类型数据,复制后也是会发生引用,我们把这种拷贝叫做“(浅复制)浅拷贝”。
看例子:
@H_502_8@var json1 = {"a":"李鹏","arr1":[1,2,3]} function copy(obj1) { var obj2 = {}; for (var i in obj1) { obj2[i] = obj1[i]; } return obj2; } var json2 = copy(json1); json1.arr1.push(4); alert(json1.arr1); //1234 alert(json2.arr1) //1234
而深复制的话,我们要求复制一个复杂的对象,那么我们就可以利用递归的思想来做,及省性能,又不会发生引用。
@H_502_8@var json1={"name":"鹏哥","age":18,3,4,5],"string":'afasfsafa',"arr2":[1,"arr3":[{"name1":"李鹏"},{"job":"前端开发求职"}]}; var json2={}; function copy(obj1,obj2){ var obj2=obj2||{}; //最初的时候给它一个初始值=它自己或者是一个json for(var name in obj1){ if(typeof obj1[name] === "object"){ //先判断一下obj[name]是不是一个对象 obj2[name]= (obj1[name].constructor===Array)?[]:{}; //我们让要复制的对象的name项=数组或者是json copy(obj1[name],obj2[name]); //然后来无限调用函数自己 递归思想 }else{ obj2[name]=obj1[name]; //如果不是对象,直接等于即可,不会发生引用。 } } return obj2; //然后在把复制好的对象给return出去 } json2=copy(json1,json2) json1.arr1.push(6); alert(json1.arr1); //123456 alert(json2.arr1); //12345
作者:虚幻的锈色
链接:
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
Json
- JSON.parse(jsonString): 在一个字符串中解析出JSON对象
@H_502_8@var str = '[{"href":"baidu.com","text":"test","orgId":123,"dataType":"curry","activeClass":"haha"}]';JSON.parse(str);
- JSON.stringify(obj) : 将一个JSON对象转换成字符串
@H_502_8@var obj = [{"href":"baidu.com","activeClass":"haha"}];JSON.stringify(obj);
结果:
"[{"href":"baidu.com","activeClass":"haha"}]"