The twenty-sixth day of learning the front end - ES5 strict mode

Today, I reviewed strings, and then did some exercises, learned ES5's strict mode and extra arrays, let's just show today's notes

1. ES5 strict mode

concept:

• In addition to the normal operating mode, ECMAScript5 adds a second operating mode: "strict mode" (strict mode). As the name suggests, this mode is JavaScript running under stricter conditions

effect:

• Eliminate some unreasonable and imprecise parts of JS syntax, and reduce some weird behaviors;
• Eliminate some unsafe aspects of code operation and ensure the safety of code operation;
• Improve compiler efficiency and increase running speed;
• Pave the way for future new versions of JS
• Note: The same code may have different running results in "strict mode". Some statements that can run normally in "normal mode" will not run in "strict mode".

strict model strict mode:

• Global mode sets the string 'use strict' at the very top of the current scope and the code below it enters strict mode
• The layout mode sets the 'use strict' of the string inside the function, and the code below it enters strict mode

use:

1. Variables must be declared using the var keyword
2. Call the function through the function name () form, this cannot point to window
3. Function parameters cannot have duplicate
4. The arguments object is not allowed to be dynamically modified
5. arguments.callee() is the same as function name()

ES5 new array:

forEach() 循环  对数组进行遍历循环，对数组中的每一项运行给定函数。这个方法没有返回值

//map可以改变当前循环的值，返回一个新的被改变过值之后的数组（map需return），一般用来处理需要修改某一个数组的值。映射
//map会把数据返回给外界，把它存储在数组里面
map(callback) :会遍历当前数组，然后调用参数中的方法，返回当前方法的返回值。

filter() 遍历和过滤。返回符合条件的元素的数组。filter需要在循环的时候判断一下是true还是false，是true才会返回这个元素。 

//注意：它只会返回第一次出现的数组元素的位置
indexOf() 查找数组里面的元素，如果有就返回对应的位置（下标）

//根据注意所示，也可以做到数组去重的效果
var arr = ['a', 'a', 'a', 'b', 'c', 'b', 'c', 'd', 'a'];
var res = arr.filter(function(item, index, arr){
    
    
    console.log(item, index);
    //     arr.indexOf('a') ==  0
    //                  0
    return arr.indexOf(item) == index;
})
console.log(res);

Two, Math object

• The Math object is a built-in object of JS, and the built-in objects of JS can be used directly without paying attention to how to realize it
• Math.PI : pi
• Math.abs(): absolute value
• Math.ceil(): round up (integer plus 1, decimal removed)
• Math.floor(): round down (remove decimals directly)
• Math.round(): rounding
• Math.pow(): x to the yth power
• Math.sqrt(): square root
• Math.random(): returns a random decimal between 0 and 1
  Random number formula: Math.random * (max-min) + min
  

example:

//求直角三角形斜边长  c*c = a*a + b*b
function getLong(a, b){
    
    
    //var c = a*a + b*b;
    var c = Math.pow(a, 2) + Math.pow(b, 2);
    //开平方
    c = Math.sqrt(c);
    return c;
}
var res = getLong(3, 4);
console.log(res);

//网页背景变色  十六进制的颜色值
var max = 999999;
var min = 100000;
var random = Math.floor(Math.random()*(max-min)+min);
document.body.bgColor = '#'+random;	

timer:

• Parameter 1 is a function parameter 2 is time
• Callback function: use the function itself as a parameter to another function, which is called a callback function
• Timers allow programs to change over time and do certain things dynamically

grammar:

setInterval(函数or代码，时间间隔)

//例子：网页背景换色
var max = 999999;
var min = 100000;
setInterval(function(){
    
    
	var random = Math.floor(Math.random()*(max-min)+min);
	console.log(random);
	document.body.bgColor = '#'+random;
}, 1000)

Timer accumulation problem:

• When the button is clicked multiple times, it is equivalent to opening multiple timers. When the close button is clicked, the currently opened timer is actually closed. The previously opened timer is not closed, which leads to the problem of timer accumulation.
• Solution: Clear first and then open clearInterval();