注:引用自https://www.cnblogs.com/ruoqiang/p/6217929.html。 https://blog.csdn.net/zengyonglan/article/details/53465505 。 https://blog.csdn.net/qq_18663357/article/details/54928572
forEach遍历数组
[].forEach(function(value, index, array) { // ... });
例子
var myArry =[1,2,3,4]; myArry.desc =‘four‘; myArry.forEach((value,index,arr)=>{ console.log(value); }); //1 //2 //3 //4
forEach遍历数组,而不是遍历对象哦,而且在遍历的过程中不能被终止,必须每一个值遍历一遍后才能停下来
注意其与jQuery的$.each类似,只不过参数正好是相反的
$.each([], function(index, value, array) { // ... });
$.each遍历数组或者类数组
第1个和第2个参数正好是相反的,这里要注意了,不要记错了。
for in遍历对象
循环遍历对象的key,是键值对前面的那一个哦
一般不推荐遍历数组,因为for in遍历后的不能保证顺序,而且原型链上的属性也会被遍历到,因此一般常用来遍历非数组的对象并且使用hasOwnProperty()方法去过滤掉原型链上的属性
var myArry =[1,2,3,4]; myArry.desc =‘four‘; for(var value in myArry){ //循环key console.log(value) } //"0" //"1" //"2" //"3" //"desc" 注意这里添加上去的属性也被遍历出来了
for of遍历对象
循环遍历对象的值,是遍历键值对后面的那一个value哦 ,与for in遍历key相反
var myArry =[1,2,3,4]; myArry.desc =‘four‘; for(var value of myArry){ console.log(value) } //1 //2 //3 //4
- 这是最简洁、最直接的遍历数组元素的语法
- 这个方法避开了for-in循环的所有缺陷
- 与forEach()不同的是,它可以正确响应break、continue和return语句
在 Javascript 语言中,constructor 属性是专门为 function 而设计的,它存在于每一个 function 的prototype 属性中。这个 constructor 保存了指向 function 的一个引用。
在定义一个函数(代码如下所示)时,
function F() {
// some code
}
? JavaScript 内部会执行如下几个动作:
1.为该函数添加一个原形(即 prototype)属性
2. 为 prototype 对象额外添加一个 constructor 属性,并且该属性保存指向函数F 的一个引用
这样当我们把函数 F 作为自定义构造函数来创建对象的时候,对象实例内部会自动保存一个指向其构造函数(这里就是我们的自定义构造函数 F)的 prototype 对象的一个属性proto,
所以我们在每一个对象实例中就可以访问构造函数的 prototype 所有拥有的全部属性和方法,就好像它们是实例自己的一样。当然该实例也有一个 constructor属性了(从 prototype 那里获得的),每一个对象实例都可以通过 constrcutor 对象访问它的构造函数,请看下面代码:
var f = new F();
alert(f.constructor === F);// output true
alert(f.constructor === F.prototype.constructor);// output true
我们可以利用这个特性来完成下面的事情:
对象类型判断,如
if(f.constructor === F) {
// do sth with F
}
其实 constructor 的出现原本就是用来进行对象类型判断的,但是 constructor 属性易变,不可信赖。
用arrow function写function比原来的写法要简洁清晰很多:
function(i){ return i + 1; } //ES5
(i) => i + 1 //ES6
简直是简单的不像话对吧…
如果方程比较复杂,则需要用{}把代码包起来:
function(x, y) {
x++;
y--;
return x + y;
}
(x, y) => {x++; y--; return x+y}
除了看上去更简洁以外,arrow function还有一项超级无敌的功能!
长期以来,JavaScript语言的this对象一直是一个令人头痛的问题,在对象方法中使用this,必须非常小心。例如:
class Animal {
constructor(){
this.type = ‘animal‘
}
says(say){
setTimeout(function(){
console.log(this.type + ‘ says ‘ + say)
}, 1000)
}
}
var animal = new Animal()
animal.says(‘hi‘) //undefined says hi
运行上面的代码会报错,这是因为setTimeout中的this指向的是全局对象。所以为了让它能够正确的运行,传统的解决方法有两种:
第一种是将this传给self,再用self来指代this
says(say){
var self = this;
setTimeout(function(){
console.log(self.type + ‘ says ‘ + say)
}, 1000)
第二种方法是用bind(this),即
says(say){
setTimeout(function(){
console.log(self.type + ‘ says ‘ + say)
}.bind(this), 1000)
但现在我们有了箭头函数,就不需要这么麻烦了:
class Animal {
constructor(){
this.type = ‘animal‘
}
says(say){
setTimeout( () => {
console.log(this.type + ‘ says ‘ + say)
}, 1000)
}
}
var animal = new Animal()
animal.says(‘hi‘) //animal says hi
当我们使用箭头函数时,函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,它的this是继承外面的,因此内部的this就是外层代码块的this。
原文地址:https://www.cnblogs.com/LQLM/p/9914889.html