1、0.1+0.2===0.3吗?为什么?
0.1+0.2=0.30000000000000004
省流:由于0.1在转二进制时精度丢失
这是因为js中的数字都是用IEEE754标准的双精度浮点数表示的,这种表示方法在转换成二进制时会有精度损失,导致一些十进制的小数无法精确表示。例如,0.1在二进制中是一个无限循环小数,类似于十进制中的1/3。因此,在计算0.1+0.2时,实际上是对两个近似值进行运算,得到的结果也是一个近似值,而不是0.3。
解决办法:
// 方法一:使用toFixed0方法将数字转换为指定小数位数的字符串,比如(0.1+0.2).toFixed(1) ===0.3。
var a = 0.2
var b = 0.4;
var c = 0.6;
if ((a + b).toFixed(1) === c.toFixed(1)) {
console.log('a + b == c')
}
//方法二:定义一个很小的数作为误差范围,比如1e10,然后判断两个数字之差的绝对值是否小于这个范围,比如Math.abs(0.1+0.2-0.3)<1e-10。
var delta = 1e-10; // 定义误差范围
var a = 0.2;
var b = 0.4
var c = 0.6
if (Math.abs(a + b - c) < delta) {
console.log('a + b == c');
}
//方法三:把数字四舍五入为最接近的整数,比如使用Math.round()方法
var a = 0.1;
var b = 0.2;
var c = 0.3;
if (Math.round((a + b) * 10) === Math.round(c * 10)) {
console.log('a + b == c')
}
2、什么是事件委托?
事件委托是一种利用事件冒泡机制的技巧,它可以让父元素代替子元素处理事件,从而减少事件绑定的数量,提高性能和可维护性。
<ul id="list">
<li>Apple</li>
<li>Banana</li>
<li>Orange</li>
</ul>
<script>
var list = document.getElementById('list'); // 获取u1元素
list.onclick = function (e) { // 给u1元素绑定点击事件
e = e || window.event; // 获取事件对象,兼容IE
var target = e.target || e.srcElement; // 获取事件目标,兼容IE
if (target.nodeName.toLowerCase() === "li") { // 判断事件目标是否是li元素
alert(target.innerHTML); // 弹出li元素的文本内容
}
}
</script>
-
优点:
- 提高性能,减少事件绑定的数量和内存占用。
- 动态监听,可以自动绑定动态添加的元素,无需手动操作。
- 方便管理,只需要在一个地方修改事件处理函数,而不用到处寻找。
-
缺点:
-
事件冒泡可能会受到干扰,导致事件委托失效或出错
-
不适合所有的事件,比如focus、blur、change等不会冒泡的事件,或者mouseover、mouseout等频繁触发的事件。
-
3、get和post请求的区别?
- get是用来从服务器上获取数据,post是用来向服务器提交数据。
- get把参数放在url中,post把参数放在请求体中。
- get的参数有长度限制,一般不超过2K个字节,post没有限制。
- get只能发送ASCII字符,post可以发送任意类型的数据。
- get相对于post不太安全,因为参数直接暴露在url上,可能会被第三方看到或者保存在浏览器历史中。
- get可以被缓存和收藏为书签,post不可以。
- get产生一个TCP数据包,post产生两个TCP数据包(有些浏览器可能只产生一个)。
4、实现继承的方式有哪些?
-
原型链继承:将父类的实例作为子类的原型,实现对父类原型属性和方法的继承,但是不能继承父类的实例属性。
// 定义父类 function Animal(name) { this.name = name; } // 定义父类原型方法 Animal.prototype.say = function () { console.log(this.name + ' says hello'); }; // 定义子类 function Dog(name) { this.name = name; } // 将父类的实例作为子类的原型 Dog.prototype = new Animal(); // 创建子类的实例 var dog = new Dog('Tom'); // 调用父类的方法 dog.say(); // Tom says hello
-
构造函数继承:在子类的构造函数中调用父类的构造函数,实现对父类实例属性和方法的继承,但是不能继承父类的原型属性和方法。
// 定义父类 function Animal(name) { this.name = name; this.say = function () { console.log(this.name + ' says hello'); }; } // 定义子类 function Dog(name) { // 在子类构造函数中调用父类构造函数 Animal.call(this, name); } // 创建子类的实例 var dog = new Dog('Tom'); // 调用父类的方法 dog.say(); // Tom says hello
-
组合继承:结合原型链继承和构造函数继承,使用原型链对父类原型属性和方法进行继承,使用构造函数对父类实例属性和方法进行继承,实现对父类所有属性和方法的继承,但是会调用两次父类构造函数。
// 定义父类 function Animal(name) { this.name = name; } // 定义父类原型方法 Animal.prototype.say = function () { console.log(this.name + ' says hello'); }; // 定义子类 function Dog(name) { // 在子类构造函数中调用父类构造函数 Animal.call(this, name); } // 将父类的原型赋值给子类的原型 Dog.prototype = new Animal(); // 创建子类的实例 var dog = new Dog('Tom'); // 调用父类的方法 dog.say(); // Tom says hello
-
class继承:使用ES6中的class关键字定义类,并使用extends关键字实现子类对父类的继承,本质上还是基于原型链和构造函数的组合继承。
// 使用class关键字定义父类 class Animal { constructor(name) { this.name = name; } // 使用class语法定义原型方法 say() { console.log(this.name + ' says hello'); } } // 使用class和extends关键字定义子类并继承父类 class Dog extends Animal { constructor(name) { // 在子类构造函数中调用super()方法来调用父类构造函数 super(name); } } // 创建子类的实例 let dog = new Dog('Tom'); // 调用父类的方法 dog.say(); // Tom says hello