zoukankan      html  css  js  c++  java
  • 阿里前端笔试题2

    1.写一个求和的函数sum,达到下面的效果

    // Should equal 15
    sum(1, 2, 3, 4, 5);
    // Should equal 0
    sum(5, null, -5);
    // Should equal 10
    sum('1.0', false, 1, true, 1, 'A', 1, 'B', 1, 'C', 1, 'D', 1,
      'E', 1, 'F', 1, 'G', 1);
    // Should equal 0.3, not 0.30000000000000004
    sum(0.1, 0.2);
    

    (1) parseFloat()函数将字符串转换成浮点数;

        paseFloat(String)

      如:window.parseFloat("-2");//返回-2

         parseInt()函数将字符串转换为整数

      如:window.parseInt("3.5");//返回3

        window.parseInt("bar");//返回NaN,意思就是不能转换为数字

        window.parseInt("1010",2);//返回10,这个就是二进制的转换

    (2)toFixed()函数

      1. toFixed(n) 限制小数点后位数,四舍五入。n:0~20 。

      2. 作用对象必须是number,不能为其他类型。如(8.001).toFixed(2)返回8.00;

      3. toFixed(n)返回值是String类型,所有当成数字进行比大小是错误的。

      4. parseFloat(“number“)与parseInt("number")读取字符串中第一个遇到的数(如91.2w3 第一个数为91.2)并转换为float或int,返回类型为number.

      如:

        var a0 = 8.01.toFixed();
        var a1 = parseFloat("8.006").toFixed(2);
        var a2 = parseFloat("9.091").toFixed(2);
        a0,a1,a2的类型都是string

    (3)Arguments类和arguments属性(是javascript的内置类)
      Arguments类是用于存储和访问函数的参数,它位于函数体内部,可以使用Function类的arguments属性对其进行访问。
      Arguments类代表的这些参数作为数组元素存储,所以就进行这样的访问,第一个参数就是arguments[0],第二个arguments[1]....
      arguments.length属性表示传递给函数的参数数目,但是,传递给函数的参数与该函数声明的参数的数目可能不同。下面的代码就是这么做的。
    <!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>求和</title>
    	<script type="text/javascript">
    		function sum() {
    		    var nResult = 0;
    		    for (var i = 0, len = arguments.length; i < len; i++) {
    		        nResult += window.parseFloat(arguments[i]) || 0;
    		    }
    		    return nResult.toFixed(3) * 1000 / 1000;
    		}
    		console.log(sum(1,2,3,4,5));
    		console.log(sum(5,null,-5));
    		console.log(sum('1.0', false, 1, true, 1, 'A', 1, 'B', 1, 'C', 1, 'D', 1,
      'E', 1, 'F', 1, 'G', 1));
    		console.log(sum(0.1,0.2));
    	</script>
    </head>
    <body>
    	
    </body>
    </html>
    

      

    上面的代码,

    window.parseFloat(arguments[i]) || 0   
    parseFloat的结果要么为一个小数,要么为NaN,||运算如果前一个为真则不计算后一个,直接返回前一个表达式的值,如果是NaN则返回后一个表达式的值;
     
    nResult.toFixed(3) * 1000 / 1000
    这个是在做:保留三位小数并且去掉末尾的0,最后一位会进行四舍五入。

    2. 请写一个表格以及对应的CSS,使表格奇数行为白色背景,偶数行为灰色背景,鼠标移上去时为黄色背景。

      通过for循环遍历,然后

      trs[i].className=(i%2==0)?'even':'odd';

     来判定是奇数行还是偶数行

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>奇偶行变色</title>
        <style type="text/css">
            tr{
                text-align: center;
            }
            .even{
                background-color:grey;
            }
            .odd{
                background-color: white;
            }
            .ye{
                background-color: yellow;
            }
        </style>
        <script type="text/javascript">
            window.onload=function(){
                var tab=document.getElementById('t1');
                var tbody=tab.getElementsByTagName('tbody')[0];
                var trs=tbody.getElementsByTagName('tr');
                for(var i=0;i<trs.length;i++){
                    trs[i].className=(i%2==0)?'even':'odd';
                     //鼠标移上去会变黄色
                    trs[i].onmouseover=function(){
                        this.className='ye';
                    }
                    trs[i].onmouseout=function(){
                        this.className=' ';
                    }
                }
    
            }
        </script>
    </head>
    <body>
        <div style="margin:10px 0;">
            <table id="t1" style="500px;height:auto">
                <thead>
                    <tr style="background-color:#00ae9d">
                        <td>序号</td>  
    ​                    <td>姓名</td> 
                        ​<td>年龄</td> 
    ​                 </tr>
                <thead>
                <tbody>   
    ​                 <tr>
                        <td>1</td>
                        <td>张三</td>
                        <td>24</td>
                    </tr> 
    ​                 <tr>
    ​                    <td>2</td>
    ​                    <td>李逵</td>
    ​                    <td>38</td>
    ​                 </tr>  
    ​                 <tr>
    ​                    <td>3</td>
    ​                    <td>林冲</td>
    ​                    <td>43</td>
    ​                 </tr>   
    ​            </tbody>
             </table>
         </div>
    </body>
    </html>
    

    3. 写一个traverse函数,输出所有页面宽度和高度大于50像素的节点。

     (1)在DOM中,HTML文档的各个节点被视为各种类型的Node对象,并且将HTML文档表示为Node对象的树。对于任何一个树形结构来说,最常做的就是遍历树。在DOM中,可以通过parentNode,firstChild,nextChild,lastChild,childNodes(节点所有的子节点)等属性来遍历文档树。

     (2)concat用于数组的连接。

    <!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>转换</title>
    	<script type="text/javascript">
    		function traverse(oNode){
    			var aResult=[];
    			var oNode=oNode||doucment.body;
    			if(oNode.style){
    				var nWidth=window.parseInt(oNode.style.width,10)||0;
    				var nHeight=window.parseInt(oNode.style.height,10)||0;
    				if(nWidth>50 && nHeight>50){
    					aResult.push(oNode);
    				}
    			}
    			var aChildNodes=oNode.childNodes;
    			if (aChildNodes.length>0) {
    				for(var i=0,len=aChildNodes.length;i<len;i++){
    					var oTemp=aChildNodes[i];
    					aResult=aResult.concat(traverse(oTemp));
    				}
    			}
    			return aResult;
    		}
    	</script>
    </head>
    <body>
    	
    </body>
    </html>
    

      

     

  • 相关阅读:
    【Python爬虫学习笔记10】多线程中的生产者消费者模式
    【Python爬虫学习笔记9】threading多线程
    【Python爬虫学习笔记8-2】MongoDB数据库操作详解
    【Python爬虫学习笔记8-1】MySQL数据库和MongoDB数据库存储概述
    【Python爬虫学习笔记7】CSV文件存储
    好书一起读(85):算法笔记
    好书一起读(82):电脑的原理
    写个shell脚本
    Scala基础语法
    初识函数式编程的一点漫谈
  • 原文地址:https://www.cnblogs.com/GumpYan/p/5841420.html
Copyright © 2011-2022 走看看