Twitter面试题（Javascript实现）

最新推荐文章于 2024-04-04 10:42:27 发布

58coding

最新推荐文章于 2024-04-04 10:42:27 发布

阅读量409

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/of214/article/details/22497473

版权

JavaScript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

题目要求如下：

http://androidguy.blog.51cto.com/974126/1319659

实现代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <title>放水</title>
  <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
  <style type="text/css">

        /*水样式*/
        .td_water
        {
            width:30px;
            border:1px solid blue;
            
        }

        /*空气样式*/
        .td_air
        {
            width:30px;
            border:1px solid white;
            
        }

        /*木块样式*/
        .td_wood
        {
            width:30px;
            border:1px solid black;
            
        }
        
        
  </style>
  
 </head>
 <body >
    

    <h3>生成图形：</h3>
    <div id='div_wall_area' style="border:1px solid green;">
        
    </div>
    <br>

    <div id="console_area" style="width:1000px; height:250px;border:1px solid green;overflow-x:auto;overflow-y:auto;">
        <h3>控制台：</h3>
    </div>

    <input οnblur="changeTD(this)"/>
 </body>
</html>
<script type="text/javascript">
    function println(msg)
    {
        $("#console_area").append((msg==null?"":msg)+"<br>");
    }

    function print(msg)
    {
        $("#console_area").append(msg);
    }

    function Wall(columns)
    {
        this.waterCount=0;
        this.columns=columns;
        this.pointList=[];//记录水箱坐标

        //显示文本
        this.waterBoxStyle=" *";
        this.airBoxStyle="  -";
        this.woodBoxStyle="  0";

        this.calc=function()
        {
            for(var x=0;x<this.columns.length;x++)
            {
                this.waterCount += this.calcCurrentColumn(x);
            }
            return this.waterCount;
        }

        this.calcCurrentColumn=function(x)
        {
            var currentHeight = this.columns[x];
            var left = this.left(x);// 左侧墙
            var right = this.right(x);// 右侧墙
            var curWhite = 0;
            // 如果有一边为“0”，水就会流出
            if (left.length != 0 && right.length != 0)
            {
                //以最高墙为准 计算水面积
                //左侧最高墙
                var lMax = this.getMax(left);
                //右侧最高墙
                var gMax = this.getMax(right);
                
                curWhite = Math.min(lMax, gMax) - currentHeight;
                this.addPoint(x,currentHeight, curWhite);// 保存可以放水的箱子的坐标
            }
            println("第\t"+(x+1)+"\t列可放\t"+curWhite+"\t箱水");
            return curWhite;
        }


        this.getMax=function(n)
        {
            var max = 0;
            for (var i = 0; i < n.length; i++)
            {
                if (n[i] > max)
                {
                    max = n[i];
                }
            }
            return max;
        }
    
         // 计算坐标高墙数
        this.left=function(y)
        {
            var ls = [];
            var currentHeight = this.columns[y];
            for (var j = 0; j < y; j++)
            {
                if (this.columns[j] > currentHeight)
                {
                    ls.push(this.columns[j]);
                }
            }
            return ls;
        }

        // 计算右边高墙
        this.right=function(y)
        {
            var gs = [];
            var currentHeight = this.columns[y];
            for (var j = y; j < this.columns.length; j++)
            {
                if (this.columns[j] > currentHeight)
                {
                    gs.push(this.columns[j]);
                }
            }
            return gs;
        }

        this.addPoint=function(x,cur,yCount)
        {
            for (var j = 0; j < yCount; j++)
            {
                this.pointList.push({x:x,y:cur + j});//“cur + j”表示在当前高度的基础上再提高“y”轴高度
            }
        }

        //打印效果
        this.showTable=function()
        {
            var maxHeight = this.getMax(this.columns);
            var  html="";
            for (var y = maxHeight; y >= 0; y--)
            {
                //var tr="<tr>";
                for (var x = 0; x < this.columns.length; x++)
                {
                    if (this.columns[x] <= y)
                    {
                        if (this.isWhite(x, y))
                        {
                            print(this.waterBoxStyle);
                            html+="<span class='td_water'  td_point='"+x+"_"+y+"'>"+this.waterBoxStyle+"</span>";
                        }
                        else
                        {
                            print(this.airBoxStyle);
                                html+="<span class='td_air'  td_point='"+x+"_"+y+"'>"+this.airBoxStyle+"</span>";
                        }
                    }
                    else
                    {
                        print(this.woodBoxStyle);
                        html+="<span class='td_wood' td_point='"+x+"_"+y+"'>"+this.woodBoxStyle+"</span>";
                    }
                }
                html+="<br>";
                println();
            }
            $("#div_wall_area").append(html);
            
        }
        
        
        //该坐标的箱子是否可防水
        this.isWhite=function(x,y)
        {
            var flag = false;
            for (var i = 0; i < this.pointList.length; i++)
            {
                var point = this.pointList[i];
                if (point.x == x && point.y == y)
                {
                    flag = true;
                    break;
                }
            }
            return flag;
        }
    }

    var wall = new Wall([1, 3, 9, 5, 8, 22, 3, 22, 3, 3, 5, 6,5,3,2,1,22, 31,1,3,32,3,4]);
    var result = wall.calc();
    wall.showTable();
    println(result+"箱水");

    
    function changeTD(t)
    {
        $("[td_point="+t.value+"]").html("改变了");
    }
  </script>

--------------------------------------------------------------------------------------------------------------------------

PS:用比较笨的方法实现了，请各位大神来优化。

原文地址：http://58coding.com/article/detail/24659963087426145