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);
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,547评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,399评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,428评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,599评论 1 274
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,612评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,577评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,941评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,603评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,852评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,605评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,693评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,375评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,955评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,936评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,172评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,970评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,414评论 2 342

推荐阅读更多精彩内容