js基礎編程

1.查找數組元素位置
如果數組中存在item,則返回元素在數組中的位置,否則返回-1

function indexOf(arr, item) {
    for(var i=0;i<arr.length;i++){
        if(arr[i]==item){
            return i;
        }
    }
    return -1;
}

2.數組求和
數組中的元素均爲Number類型

function sum(arr) {
    var sum = 0;
    for(var i=0;i<arr.length;i++){
        sum +=arr[i];
    }
    return sum;
}

3.移除數組中的元素
移除數組 arr 中的所有值與 item 相等的元素。不要直接修改數組 arr,結果返回新的數組

function remove(arr, item) {
    var arr1 =[];
    for(var i=0; i<arr.length;i++){
        if(arr[i]!==item){
            arr1.push(arr[i]);
        }
    }
    return arr1;
}

4.移除數組中的元素
移除數組 arr 中的所有值與 item 相等的元素,直接在給定的 arr 數組上進行操作,並將結果返回 。(關鍵:數組的長度是變化的

function removeWithoutCopy(arr, item) {
    for(var i=0;i<arr.length;i++){
        if(arr[i]==item){
            arr.splice(i,1);
            i--;    //當數組刪除一個相同  的數字的時候,數組的長度是變化的。
        }
    }
    return arr;
}

5.添加元素
在數組 arr 末尾添加元素 item。不要直接修改數組 arr,結果返回新的數組

function append(arr, item) {
    var arr1 = arr.concat(item);
    return arr1;
}

6.刪除數組最後一個元素
刪除數組 arr 最後一個元素。不要直接修改數組arr,結果返回新的數組

function truncate(arr) {
    var arr1 = arr.slice(0);
    arr1.pop();
    return arr1;
}

7.添加元素
在數組 arr 開頭添加元素 item。不要直接修改數組 arr,結果返回新的數組

function prepend(arr, item) {
    var arr1 = arr.slice(0);
    arr1.unshift(item);
    return arr1;
}

8.刪除數組第一個元素
刪除數組 arr 第一個元素。不要直接修改數組 arr,結果返回新的數組

function curtail(arr) {
    var arr1 = arr.slice(0);
    arr1.shift();
    return arr1;
}

9.數組合並
合併數組 arr1 和數組 arr2。不要直接修改數組 arr,結果返回新的數組

function concat(arr1, arr2) {
    var arr1 = arr1.concat(arr2);
    return arr1;
}

10.添加元素
在數組 arr 的 index 處添加元素 item。不要直接修改數組 arr,結果返回新的數組

function insert(arr, item, index) {
    var arr1 = arr.slice(0);
    arr1.splice(index,0,item);
    return arr1;
}

11.計數
統計數組 arr 中值等於 item 的元素出現的次數

function count(arr, item) {
    var j=0;
    for(var i=0; i<arr.length;i++){
        if(arr[i]==item){
            j++;
        }
    }
    return j;
}

12.查找重複元素
找出數組 arr 中重複出現過的元素

function duplicates(arr) {
    var arr1=[];
    for (var i=0;i<arr.length;i++){
        for(var j=i+1;j<arr.length;j++){
            if(arr[i]==arr[j]&& arr1.indexOf(arr[i]) == -1){ //劃橫線的意思是,數組arr1裏arr[i]這個數沒有再出現(即就這一個)。
                arr1.push(arr[i]);
            }
        }
    }
    return arr1;
}

13.求二次方
爲數組 arr 中的每個元素求二次方。不要直接修改數組 arr,結果返回新的數組

function square(arr) {
    var arr1=[];
    for(var i=0;i<arr.length;i++){
        arr1.push(Math.pow(arr[i],2));
    }
    return arr1;
}

14.查找元素位置
在數組 arr 中,查找值與 item 相等的元素出現的所有位置

function findAllOccurrences(arr, target) {
    var arr1=[];
    for(var i=0;i<arr.length;i++){
        if(arr[i]==target){
            arr1.push(i);
        }
    }
    return arr1;
}

15.在Javascript語言中,聲明局部變量使用的都是關鍵字var,如果不使用var而直接聲明變量,則該變量爲全局變量。

16.parseInt( )函數
parseInt( ) 函數可解析一個字符串,並返回一個整數。
語法:parseInt(string,radix)
當參數 radix 的值爲 0,或沒有設置該參數時,parseInt() 會根據 string 來判斷數字的基數。
舉例,如果 string 以 “0x” 開頭,parseInt() 會把 string 的其餘部分解析爲十六進制的整數。如果 string 以 0 開頭,那麼 ECMAScript v3 允許 parseInt() 的一個實現把其後的字符解析爲八進制或十六進制的數字。如果 string 以 1 ~ 9 的數字開頭,parseInt() 將把它解析爲十進制的整數。

17.實現一個打點計時器,要求
1、從 start 到 end(包含 start 和 end),每隔 100 毫秒 console.log 一個數字,每次數字增幅爲 1
2、返回的對象中需要包含一個 cancel 方法,用於停止定時操作
3、第一個數需要立即輸出

function count(start, end) {
    var num = null;
    console.log(start);
    num = setInterval(function(){
        if(start<end){
            console.log(++start);}
    },100);
    return {
        cancel:function(){
            clearInterval(num);}}}

18.實現 fizzBuzz 函數,參數 num 與返回值的關係如下:
1、如果 num 能同時被 3 和 5 整除,返回字符串 fizzbuzz
2、如果 num 能被 3 整除,返回字符串 fizz
3、如果 num 能被 5 整除,返回字符串 buzz
4、如果參數爲空或者不是 Number 類型,返回 false
5、其餘情況,返回參數 num

function fizzBuzz(num) {
    if(num%3==0 && num%5==0){
        return ("fizzbuzz");
    }else if(num%3 ==0){
        return ("fizz");
    }else if(num%5 ==0){
        return ("buzz");
    }else if(num == null || typeof(num) != "number"){
        return false;
    }else{
        return num;}  
}

19.將數組 arr 中的元素作爲調用函數 fn 的參數

function argsAsArray(fn, arr) {
    return fn.apply(this,arr);
}

20.將函數 fn 的執行上下文改爲 obj 對象
思路:將函數 fn 的執行上下文改爲 obj 對象,只需要將obj作爲call或者apply的第一個參數傳入即可。

function speak(fn, obj) {
    return fn.apply(obj,obj);
}

21.實現函數 functionFunction,調用之後滿足如下條件:
1、返回值爲一個函數 f
2、調用返回的函數 f,返回值爲按照調用順序的參數拼接,拼接字符爲英文逗號加一個空格,即 ‘, ’
3、所有函數的參數數量爲 1,且均爲 String 類型

function functionFunction(str) {
    var f = function(string){
        return str += ', '+string;
    }
    return f;
}

22.實現函數 makeClosures,調用之後滿足如下條件:
1、返回一個函數數組 result,長度與 arr 相同
2、運行 result 中第 i 個函數,即 resulti,結果與 fn(arr[i]) 相同
思路:簡單的描述閉包:如果在函數func內部聲明函數inner,然後在函數外部調用inner,這個過程即產生了一個閉包。閉包最大的用處有兩個:可以讀取到函數內部的變量,讓這些變量的值始終保持在內存中。

function makeClosures(arr, fn) {
    var result=[]; //聲明要返回的一個數組
    for(var i=0;i<arr.length;i++){//數組result的長度和arr的長度相同
        result[i]=fun(i);//數組的值等於函數的返回值。
    }
    function fun(i){//定義一個函數fun
        return function(){ //函數返回給result的是一個匿名函數。
            return fn(arr[i]); //這個匿名函數的返回值是fn(arr[i])
        }
    }
    return result;
}

23.已知函數 fn 執行需要 3 個參數。請實現函數 partial,調用之後滿足如下條件:
1、返回一個函數 result,該函數接受一個參數
2、執行 result(str3) ,返回的結果與 fn(str1, str2, str3) 一致 (二次封裝函數)

function partial(fn, str1, str2) {
    var result = function(str3){
        return fn.call(this,str1,str2,str3);
    }
    return result;
}

24.函數 useArguments 可以接收 1 個及以上的參數。請實現函數 useArguments,返回所有調用參數相加後的結果。本題的測試參數全部爲 Number 類型,不需考慮參數轉換。

function useArguments() {
    var sum =0;
    for (i=0;i<arguments.length;i++){
        sum +=arguments[i];
    }
    return sum;
} 

25.使用 apply 調用函數
實現函數 callIt,調用之後滿足如下條件
1、返回的結果爲調用 fn 之後的結果
2、fn 的調用參數爲 callIt 的第一個參數之後的全部參數
思路:這道題的意思就是要使用apply來調用函數。那麼首先聲明一個數組,然後遍歷數組,將其放入到新的數組args中,因爲 fn 的調用參數爲 callIt 的第一個參數之後的全部參數 。那麼我們需要使用調用函數的方法apply()。

function callIt(fn) {
    var args=[];
    for(var i=1;i<arguments.length;i++){
        args.push(arguments[i]);
    }
    var result=fn.apply(null,args);
    return result;
}

26.二次封裝函數
實現函數 partialUsingArguments,調用之後滿足如下條件:
1、返回一個函數 result
2、調用 result 之後,返回的結果與調用函數 fn 的結果一致
3、fn 的調用參數爲 partialUsingArguments 的第一個參數之後的全部參數以及 result 的調用參數
思路:因爲arguments並不是真正的數組對象,只是與數組類似而已,所以它並沒有slice這個方法, 而Array.prototype.slice.call(arguments, 1)可以理解成是讓arguments轉換成一個數組對象,讓arguments具有slice()方法。其中的1表示的是從數組的第二個元素進行截取。

function partialUsingArguments(fn) {
    var arg1 = Array.prototype.slice.call(arguments,1);
//獲取partialUsingArguments這個函數的第一個參數之後的全部參數
    var result =function(){
        var arg2 = Array.prototype.slice.call(arguments,0);//獲取result調用的參數
        var arg =arg1.concat(arg2);//將參數整合到一個數組中。
        return fn.apply(null,arg);
    }
    return result;
}

27.柯里化
已知fn爲一個預定義函數,實現函數curryIt,調用之後滿足如下條件:
1、返回一個函數a,a的 length 屬性值爲1(即顯式聲明 a 接收一個參數)
2、調用a之後,返回一個函數b, b的 length 屬性值爲1
3、調用b之後,返回一個函數c, c的 length 屬性值爲1
4、調用c之後,返回的結果與調用 fn 的返回值一致
5、fn的參數依次爲函數a, b, c的調用參數
柯里化:把接受多個參數的函數變換成接受一個單一參數的函數,並且返回接受餘下的參數且返回結果的新函數的技術。
思路: 簡單來說,柯里化是一種允許使用部分函數參數構造函數的方式。也就是意味着,你在調用一個函數時,可以傳入需要的全部參數並獲得返回結果,也可以傳入部分參數並的得到一個返回的函數,它需要傳入的就是其餘的參數。

function curryIt(fn) {
   return a=function(ra){
       return b=function(rb){
           return c=function(rc){
               return fn(ra,rb,rc);
           }
        }
    }
}

28.模塊
完成函數 createModule,調用之後滿足如下要求:
1、返回一個對象
2、對象的greeting屬性值等於str1,name屬性值等於str2
3、對象存在一個sayIt方法,該方法返回的字符串爲greeting屬性值 + ‘, ’ + name屬性值

function createModule(str1, str2) {
    var obj = new Object();
    obj.greeting = str1;
    obj.name = str2;
    obj.sayIt = function(){return obj.greeting+', '+obj.name;};
    return obj;
}

或者

function createModule(str1, str2) {
    return {
            greeting : str1,
            name : str2,
            sayIt : function (){
                return this.greeting + ', ' + this.name;
            }
        }
  }

29.二進制轉換
將給定數字轉換成二進制字符串。如果字符串長度不足 8 位,則在前面補 0 到滿8位。

function convertToBinary(num) {
    var a2 = parseInt(num).toString(2);
    if(a2.length<8){
        for(var i=0; i<8-a2.length;i++){
            a2 = "0"+a2;
        }
    }
    return a2;
}

30.屬性遍歷
找出對象 obj 不在原型鏈上的屬性(注意這題測試例子的冒號後面也有一個空格~)
1、返回數組,格式爲 key: value
2、結果數組不要求順序

function iterate(obj) {
    var arr=[];
    for(var key in obj){
        // hasOwnProperty用於檢驗obj的屬性key是否是自有的(而不是原型鏈的)
        if(obj.hasOwnProperty(key)){
            arr.push(key+": "+obj[key]);
        }
    }
    return arr;
}

31.正則表達式
(1)判斷是否包含數字
給定字符串 str,檢查其是否包含數字,包含返回 true,否則返回 false

function containsNumber(str) {
    var reg = /\d/;
    return reg.test(str);
}

(2)檢查重複字符串
給定字符串 str,檢查其是否包含連續重複的字母(a-zA-Z),包含返回 true,否則返回 false
思路:在正則表達式中,使用斜槓加數字表示引用,\1就是引用第一個分組, 將 [a-zA-Z] 作爲一個分組進 行引用

function containsRepeatingLetter(str) {
     var reg=/([a-zA-Z])\1/;    //\1是對第一個括號中的內容的引用  
     return reg.test(str);  
}

(3)判斷是否以元音字母結尾
給定字符串 str,檢查其是否以元音字母結尾
1、元音字母包括 a,e,i,o,u,以及對應的大寫
2、包含返回 true,否則返回 false
$表示匹配結尾,/i表示忽略大小寫

function endsWithVowel(str) {
    var reg = /[aeiou]$/i;
    return reg.test(str);
}

(4)獲取指定字符串
給定字符串 str,檢查其是否包含 3 個連續的數字
1、如果包含,返回最新出現的 3 個數字的字符串
2、如果不包含,返回 false

function captureThreeNumbers(str) {
    var reg=/\d{3}/;
    var matcher=str.match(reg);
    if(matcher){
        return matcher[0];
    }
    else return false;
}

(5)判斷是否符合指定格式
給定字符串 str,檢查其是否符合如下格式
1、XXX-XXX-XXXX
2、其中 X 爲 Number 類型

function matchesPattern(str) {
    var reg = /^\d{3}-\d{3}-\d{4}$/;
    return reg.test(str);
}

(6)判斷是否符合 USD 格式
給定字符串 str,檢查其是否符合美元書寫格式
1、以 2滿3,324 1,023,032.03 或者 2.03 3,432,12.12 或者 34,344.3usd 開頭,數字結尾, ,而正則表達式中$表示結尾,需要進行轉義,因此開頭爲 ^\$。
代碼如下:

function isUSD(str) {
    var reg=/^\$([1-9]\d{0,3})(,\d{3})*(\.\d{2})?$/;  
    /*1、以 $ 開始: ^$ 
    2、$之後的第一組數字可能是0,1,2,3位: [1-9]\d{0~3} 
    3、第二組開始之後的數字每組都是一個,加上三個數字:(,\d{3})*  //*表示可匹配0~n組 
    4、如果有小數部分,格式爲 .加上兩個數字(注意對.進行轉義;並且小數爲結尾部分):(\.\d{2})?$ */  
    return reg.test(str);  
}

32.修改this指向
封裝函數 f,使 f 的 this 指向指定的對象
Apply是解決this指向最經典的做法。

function bindThis(f, oTarget) {
    var func = function(){
        return f.apply(oTarget,arguments);
    }
    return func;
}

33.getCurrentPosition()用於獲得用戶的當前位置。

34.

<ul>
    <li>click me</li>
    <li>click me</li>
    <li>click me</li>
    <li>click me</li>
</ul>
var elements=document.getElementByTagName(‘li’);
var length = elements.length;
for(var i=0;i<length;i++){
element[i].onclick = function(){
alert(i);
}
}

答案爲4,4,4,4。
解答:這裏的事件,綁定的並非是i的值,而是i本身(alert裏的i),所以當程序執行完,i的值變爲4,去執行onclick事件時,執行alert(i) ,自動查找i,值爲4,所以依次彈出4。

var elements=document.getElementsByTagName('li');
    var length=elements.length;
    for(var i=0;i<length;i++){
        elements[i].οnclick=(function(a){
            return function(){
            alert(a);
            }          
        })(i);
    }
//用此代碼可以依次彈出 0,1,2,3(閉包可以“包養”外部函數變量)
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章