This is the fourth day of my participation in the More text Challenge. For details, see more text Challenge
We talked about variables, types, and objects in the last chapter. Now we talk about strings, arrays, functions, eval, and conditions.
string
string
// Don't try this: 1 < 'a'; // false 1 > 'a'; // false 1 == 'a'; // false // var a = 1; var b= 2; var foo = function () { console.log(arguments); } '${a} + ${b} = ${a+b}' // [[",'+','=',"],1,2]Copy the code
Features:
- Immutable
Trap:
- Char type does not exist
- Beware of potential syntax problems with template strings
- When a string is compared with a number, it is always converted to a number
String – mode
1. String concatenation, multi-line strings use the syntax of template strings as much as possible
More complex string concatenation scenarios use a template engine
3. Do not run strings directly as code
4. Strings displayed on the page must be escaped
Use literals to define strings
array
Array-dynamic feature
Const arr = [1,2,3]; arr.name = 'some thing'; // Disallow arrays using for... For (let key in arr) {console.log(key); } // Disallow direct manipulation of array length arr.length = 0;Copy the code
Features:
- Based on the object
- Allowed mixed type (ES6 added typed array)
- Dynamic allocation of array length
- Support for sparse arrays
Array traversal
Features:
- Supports a large number of traversal methods
- for… of
- Expansion operator
Array-like array objects
Const arrayLike = {length: 1, '1': 1}; const array = [].slice.call(arrayLike, 0}; Const arr = array. from(arrayLike);Copy the code
Features:
- duck typing
- Array.from
Array pattern –
1, Do not apply for… In traversing the number group
2. Use literals to define arrays
3. Do not manipulate the array length
4. Pay attention to the negative effects of mutator
5. Do not operate on the array in the traversal method
6. Try not to add keys to arrays that are not positive integers
function
Function – Dynamic characteristics
Let makeTeam = function (leader) {const members = [].slice.call(arguments, 1); return Team.regester({ leader, members }); }; // better let makeTeam = function (... args) { const [leader, ...members] = args; return Team.regester({ leader, members }); }; Function foo() {return {name: 'Jack', age: 18}; } const {name, age} = foo(); Function add(a, b) {return a + b; } console.log(add.toString()); // 'function add(a, b) { return a + b; }' const addTwo = (function () { const increase = 2; return function (a) { return add(a, increase); }; }) (); console.log(addTwo.toString()); // 'function (a) { return add(a, increase); } 'Copy the code
Features:
- Dynamic parameter list
- Multiple return values based on deconstruction
- caller/callee
- This dynamic
- Getting a function definition
Function – First class citizen
Function once(func) {let invoked = false; // Invoked as an argument or return value for another function. return function () { if (! invoked) { invoked = true; return func(); } } } function log() { console.log('logged'); } const logOnce = once(log); Const half = function (a) {return a / 2; }; // oops... const double = function (arr) { return [...arr, ...arr]; } ([1, 2, 3]).forEach(item => console.log(item)); // 1, 2, 3, 1, 2, 3 // IIFE const tds = document.querySelectorAll('td'); for (let i = 0; i < tds.length; i++) { tds[i].onclick = (function (i) { return function () { alert(i); } })(i) }Copy the code
Features:
- Higher-order functions
- closure
- Functional programming
- Function definition and function expression
- Execute function expressions immediately (IIFE)
The function – mode
1. Use function definitions, not function expressions, whenever possible
2. Disallow the Function constructor
3. Avoid using Arguments and use rest operators and deconstruction instead
4. Write pure functions whenever possible
5, do not modify (mutate) function parameter content
6. Use arrow functions
eval
Do not use eval
2. Disallow the Function constructor
3. When using setTimeout/ setInterval, the first argument disallows code strings
conditions
1. Prohibit comparison of different types of data
2, prohibit == and! =, use === and! = =
3. You can only perform size comparison between number and string
4. Avoid complex logical operations and use parentheses if necessary