js小Tips

1、数组插入/删除/替换
插入删除，最常想到的是push,shift
但splice效率会更高

2、多层嵌套if
多层if，且判断是否为具体值时，可以改为switch
但最好用Object方法

if (color) {  if (color === 'black') {    A();  } else if (color === 'red') {    B();  } else if (color === 'blue') {    C();  } else if (color === 'green') {    D();  } else {    E();  }}

var colorObj = {  'black': A,  'red': B,  'blue': C,  'green': D,  'yellow': E};if (color && colorObj.hasOwnProperty(color)) {  colorObj[color]();}

3、undefined,null的区别
undefined是一个全局变量的特殊属性，typeof 也是 undefined。进行数值运算时，undefined是NaN。
null是一个空的对象， typeof 是 object。进行数值运算时，null返回值是0

null是JavaScript的保留关键字，而undefined却不是
undefined 在JSON中不合法，null合法

undefined 表示一个变量没有被定义，或者定义了没有赋值。
null 是用来给变量赋值，表示”没有值”

JavaScript 会给一个没有初始化的变量赋予undefined
JavaScript 从不会将值赋为null,它是被程序员用来指定一个var 没有值。

都是 false
判断变量是否为undefined typeof variable === "undefined"
判断变量是否为null variable === null
互相比较 null == undefined // true
null === undefined // false

4、使用同一个方法处理数组和单一元素
只需要先将它们并成一个数组，然后处理这个数据即可。

function printUpperCase(words) {  var elements = [].concat(words);  for (var i = 0; i < elements.length; i++) {    console.log(elements[i].toUpperCase());  }}

5、快速检测小块代码效率
快速检测javascript代码块的执行效率，我们可以使用 console 方法，比如 console.time(label) 和 console.timeEnd(label)

console.time("Array initialize");var arr = new Array(100),    len = arr.length,    i;for (i = 0; i < len; i++) {    arr[i] = new Object();};console.timeEnd("Array initialize");

6、concat
concat() 方法用于连接两个或多个数组。
它不会改变现有的数组，而仅仅会返回被连接数组的一个副本。

7、this

// 1console.log(this); //指向全局对象也就是window// 包含了prompt alert confirm方法...// 2function test() {  console.log(this);  this.method = function inner() {console.log(this)};}; // 这里this也是指向全局对象test();//3var obj = new test(); // 因为用的是构造器，this指向test对象//4obj.method(); //方法迫使this指向对象// 5:使用call或apply迫使this指向明确的值function foo(a, b, c) {  this.a = a;  this.b = b;  this.c = c;}var bar = {};foo.apply(bar, [1, 2, 3]); //第一个参数为thisconsole.log(bar) // 会输出 a: 1, b: 2, c: 3foo.call(bar, 4, 5, 6); //同样的效果console.log(bar) //也会输出a: 4, b: 5, c: 6

关于第二个情况例子：

function test() {  this.arr = [1,2,4];  this.message = "I am here";  this.fun = function() {      this.arr.forEach(function(item) {        console.log(this.message); //会输出3次undefined，因为this指向全局对象    });  }}var t = new test();t.fun();//上面例子中，this不会指向test对象，而指向全局对象//为了避免这种情况，可以使用变量存储器this//虽然this仍指向全局对象，但是可以使用替代变量function test2() {  var self = this;  self.arr = [1,2,4];  self.message = "I am here";    self.fun = function() {      this.arr.forEach(function(item) {        console.log(self.message); //会输出I am here 3次    });  }}var t2 = new test2();t2.fun();

8、全局变量

for(var i = 0; i < 10; i++) {    innerLoop();}function innerLoop() {    // 这是个不同的作用域    for(i = 0; i < 10; i++) { // 缺少var语句，i指向全局作用域           console.log("this is will show 10 times and not 100.");//只会输出10次    }}

这个例子中，你以为会输出100次，实际只会输出10次。
过程是，第一次i=0，进入innerLoop，但innerLoop里的i跟外面i是一个，所以这次进来时，innerLoop的i从0到10执行结束后，返回外面for函数时，i已经变成了10，而不是想象中的1。

9、迭代对象的属性
可以使用Object.keys、Object.entriees或者for循环

function a() {  this.a= 1;  this.b = 2;}function child() {  this.c = 3;  this.d = 4;}//child会继承自achild.prototype = new a();var obj = new child();for (var property in obj) { //此方法不仅比Object.keys慢，而且还包含父属性    console.log(property + ": " + obj[property]);//输出abcd及值}for (var property in obj) { //这会返回适合的键，但是仍比Object.keys慢     if(obj.hasOwnProperty(property))        //输出cd及值        console.log(property + ": " + obj[property]);}//下面两种都输出cd及值Object.keys(obj).map((e) => console.log(`key=${e}  value=${obj[e]}`)); // 最佳的方式Object.entries(obj).forEach(([key, value]) => console.log(`key=${key} value=${value}`)); // 这也是不错的方法

10、转换数字

var num = "123 456"Number(num); //NaN  不是想象中的123parseInt(num); //123parseFloat(num); //123

11、访问对象的属性，可以 object.atr 或者 object[‘atr’]

12、 删除属性的唯一方法是使用 delete 操作符；设置属性为 undefined 或者null 并不能真正的删除属性， 而仅仅是移除了属性和值的关联。

13、

[] == true ; //false{} == true ; //falseif([]){  //true}if({}){  //true}