js notebook

1. this 作用域

var foo = 0
function main() {
    alert(foo)  //此时foo同this.foo，为0
    //var foo = 2  //加上该句后foo为undefined，this.foo依然为0
}
main()  //执行结果为0
new main()  //该情况下函数内this指向该函数，this.foo为undefined

2. arr技巧

//arr+''或arr.toString()可以方便拍平arr，如
var arr = [1, [2, 3], [4, 5], 6]
console.log(arr+'')  //输出字符串1, 2, 3, 4, 5, 6
console.log(arr.toString())  //输出字符串1, 2, 3, 4, 5, 6
console.log(arrStr.split(','))  //输出数组[1, 2, 3, 4, 5, 6]

3. cookie的基本操作

读取、写入和删除

    var CookieUtil = {
      get: function(name) {
        var cookieName = encodeURIComponent(name) + '=', cookieStart = document.cookie.indexOf(cookieName), cookieValue = null

        if(cookieStart > -1) {
          var cookieEnd = document.cookie.indexOf(';', cookieStart)
          if(cookieEnd === -1) {
            cookieEnd = document.cookie.length
          }
          cookieValue = decodeURIComponent(document.cookie.substring(cookieStart + cookieName.length, cookieEnd))
        }
        return cookieValue
      },
      set: function(name, value, expires, path, domain, secure) {
        var cookieText = encodeURIComponent(name) + '=' + encodeURIComponent(value)
        if(expires instanceof Date) {
          cookieText += ';expires=' + expires.toGMTString()
        }
        if(path) {
          cookieText += ';path=' + path
        }
        if(domain) {
          cookieText += ';domain=' + domain
        }
        if(secure) {
          cookieText += ';secure=' + secure
        }
        document.cookie = cookieText
      },
      unset: function(name, path, domain, secure) {
        this.set(name, "", new Date(0), path, domain, secure)
      }
    }

4. call, apply, bind

深入浅出妙用 Javascript 中 apply、call、bind
apply 、 call 、bind 三者都是用来改变函数的this对象的指向的；
apply 、 call 、bind 三者第一个参数都是this要指向的对象，也就是想指定的上下文；
apply 、 call 、bind 三者都可以利用后续参数传参；
bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用

5. prototype记录（关于是否会修改原值有些混乱，待整理）

Js 数组——filter()、map()、some()、every()、forEach()、lastIndexOf()、indexOf()
Array.prototype.valueOf()
Array.prototype.toString() //toLocaleString，使用本地分隔字符
Array.prototype.concat(args/array)
Array.prototype.join(seperate)
Array.prototype.shift() //返回删除的第一项，原arr被修改
Array.prototype.pop() //返回删除的最后一项，原arr被修改
Array.prototype.push(args) //往数组后面添加，返回添加后的arr长度，原arr被修改
Array.prototype.unshift(args) //往数组前面添加，返回添加后的arr长度，原arr被修改
Array.prototype.reverse() //原arr被修改
Array.prototype.sort() //原arr被修改
Array.prototype.forEach(function)

Array.prototype.map(function) //返回新的数组，不修改原arr，function(x)直接return对数组元素x的操作

var str = '12345';
Array.prototype.map.call(str, function(x) {
  return x;
}).reverse().join(''); //等同str.split('').reverse().join('')，原str不会被修改

// Output: '54321'
// Bonus: use '===' to test if original string was a palindrome判断回文

Array.prototype.filter(function) //function(x)直接return满足条件的x（条件式）
Array.prototype.some(function) //若array中有一项满足function中的表达式，则返回true
Array.prototype.every(function) //array中的每一项满足function中的表达式才返回true
Array.prototype.reduce(function, x) //其中x为参数传入function(x, y)，遍历数组元素y，累加器

var sum = [0, 1, 2, 3].reduce(function(acc, val) {
  return acc + val;
}, 0);
// sum is 6

//展开数组嵌套
var list1 = [[0, 1], [2, 3], [4, 5]];
var list2 = [0, [1, [2, [3, [4, [5]]]]]];

const flatten = arr => arr.reduce(
  (acc, val) => acc.concat(
    Array.isArray(val) ? flatten(val) : val
  ),
  []
);
flatten(list1); // returns [0, 1, 2, 3, 4, 5]
flatten(list2); // returns [0, 1, 2, 3, 4, 5]

Array.protorype.slice(start, end) //[start, end)，start和end可为负，start和end可为空，不修改原arr，返回新字符串
Array.prototype.splice(start, deleteNum, insertArgs) //deleteNum可为空，如果有删除项返回删除项，原arr被修改

参数数组化，相当于...args
function list() {
  return Array.prototype.slice.call(arguments);
}
var list1 = list(1, 2, 3); // [1, 2, 3]

var unboundSlice = Array.prototype.slice;
var slice = Function.prototype.call.bind(unboundSlice);
function list() {
  return slice(arguments);
}
var list1 = list(1, 2, 3); // [1, 2, 3]

String.prototype.replace(被取代的，新的) //返回新字符串
String.prototype.substr(start, length) //表示从start（可为负）开始截取length长度，返回新字符串
String.prototype.substring(start, end) //[start, end)，start和end不可为负，但可以调换位置，小值为start，大值为end，返回新字符串

6. 简单记录一下各类型的判定

function isNumber(obj) {
  return obj!== undefined && typeof(obj) === 'number' && !isNaN(obj);
}

Array.isArray(arr)

Math.pow(x, y) //x的y次幂

JS trick

In JavaScript, why is “0” equal to false, but when tested by 'if' it is not false by itself?