FreeCodeCamp学习笔记

（一）JavaScript知识点

对象

• arguments 是一个类数组对象，代表传给一个function的参数列表。它类似于数组，但没有数组所特有的属性和方法，除了length。 arguments object

方法

• obj.call() .call()
• arr/str.filter() .filter()
• str.charCodeAt(index)** 返回指定索引处字符的 Unicode 数值,开头的 128 个 Unicode 编码单元和 ASCII 字符编码一样。 charCodeAt()
• String.fromCharCode(num1, ..., numN)** 静态方法根据指定的 Unicode 编码中的序号值来返回一个字符串。（这个方法里的String是专有的，不指代字符串变量） String.fromCharCode()
• str.match() 在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。 .match()

---

Jquery方法

• $(document).ready() 当 DOM（文档对象模型）已经加载，并且页面（包括图像）已经完全呈现时，会发生ready 事件。 $(document).ready()
• Jquery事件 jQuery 事件处理方法是 jQuery 中的核心函数。 Jquery事件
• 对某一元素点击时响应事件：
  $(document).ready(function(){
  $("#getMessage").on("click", function(){
  });
  });
• jQuery.getJSON() 通过 HTTP GET 请求载入 JSON 数据。 jQuery.getJSON()
• arr/obj.forEach(callback) Firefox 和Chrome 的Array 类型都有forEach的函数，其作用是对数组中的每个元素执行回调函数。 .forEach()
• Object.keys(obj) 返回参数obj可被枚举的属性。 Object.keys(obj)
• $(selector).html() 返回或设置被选元素的内容 (inner HTML)。参数为空时返回inner HTML，有参数时进行设置。 .html()

（二）功能技巧

• 单字符大写字母ROT13密码算法 ROT13

  var charRot13 = function(char){
    if(char.charCodeAt(0) <= 77){  //77是M的Unicode码，要求char必须是大写字母
        return String.fromCharCode(char.charCodeAt(0) + 13);
    }
    else{
        return String.fromCharCode(char.charCodeAt(0) - 13);
    }
   };

• 加载完后，响应鼠标点击事件，通过AJAX请求获得JSON数据，之后改变HTML，显示出得到的JSON。（Jquery）

$(document).ready(function(){

    $("#getMessage").on("click", function(){
      $.getJSON("URL地址", function(json){
        var html = "";
        json.forEach(function(val){
          var keys = Object.keys(val);
          html += "<div class = 'x'>";
          keys.forEach(function(key){
            html += "<b>" + key + "</b>: " + val[key] + "<br>";
          });
          html += "</div><br>";
        });
        $(".message").html(html);  //change HTML of .message
      });
    });
  });

• 获得经纬度功能（Jquery）

    if(navigator.geolocation){
      navigator.geolocation.getCurrentPosition(function(position){
        $(selector).html("latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude); 
      });
    }    //Here selector generally choose div/p

（三）注意事项

• 函数定义时不要写在循环里，否则不能通过。例如

  for(var i = 1; i < arr.length; i++){
    arr[0].filter(function(val){
      return val != arr[i];
    });
  }    //错误的！

这种是不可以的。详见FCC中的Seek and Destroy(263)（下方经典问题中有）。

• 不能直接对字符串中的某个字符进行修改，只能直接对整个字符串进行修改。

这种情况str[0] = n是不允许出现的，但是可以这样：str = "abcd"。所以为了修改字符串中的某几个字符，目前会的方法是先用split()转换成Array，处理后再join()。

• Jquery中调用.html()，用存储URL的变量val.imageLink为img/a提供src/href时，注意加号连接符的读取和使用。比如：

    var htm = "";
    htm += "<img src = '" + val.imageLink + "'>";
    $(selector).html(htm);  //显示对应URL的图片

这段代码的读取不要直接看最前面和最后面的两个双引号，这样会看不懂，要这样看"<img src = '"这是第一段字符串， val.imageLink是第二段URL变量，"'>"是第三段字符串，组合起来成为inner HTML。

（四）经典问题

• Seek and Destroy 关于function不能在loop中的问题

You will be provided with an initial array (the first argument in the destroyer function), followed by one or more arguments. Remove all elements from the initial array that are of the same value as these arguments.

destroyer([1, 2, 3, 1, 2, 3], 2, 3)should return [1, 1].
destroyer([1, 2, 3, 5, 1, 2, 3], 2, 3)should return[1, 5, 1].
destroyer(["tree", "hamburger", 53], "tree", 53)should return["hamburger"].

   function destroyer(arr) {

      // Remove all the values
      var argu = 0;        //存储arguments object中的欲去除元素
      var ex = function(val){        //回调filter的函数
        return val != argu;
      };
      var i = arr.length - 1; //从arguments末尾处的去除元素开始filter
      while(i !== 0){
        argu = arguments[i];
        arguments[0] = arguments[0].filter(ex);
        i--;
      }
      return arguments[0];
     }
    destroyer([1, 2, 3, 1, 2, 3], 2, 3);