专研 JS 对以后的管理层有阻碍么？

楼主学JS有啥经验，
教教我啊，或者有资料传下，
QQ：703693685谢谢

有喜欢js的就加我啊 qq：308117229 哎还是很怕 ssh都不是很好尤其是hibernate！！！

我的意思是 js用了我很多的时间是不是根据我以后的规划应该不用浪费大量的时间花在js上面了！

学js的同时还可以学其他的呀难道学的时候只学js嘛。

JavaScript 远比 Java 复杂，有些概念在 Java 中根本就不存在，比如：闭包、原型、弱类型等等。加之 IE 与标准不符合，还得兼顾浏览器的兼容性。有兴趣的话，可以去看一下这些书：

从您的回复中看到，你目前还是位学生。有目标固然是好，但是把技术都归纠于是否对成为管理层有用，那就很有问题了。希望楼主能从最为基本的做起，不要好高骛远。另外，JavaScript 与管理层没有丝毫的关系！

对啊，JavaScript 中函数就是类，声明一个类就等于在声明一个函数，可以看一下下面这些原来写的代码，代码中有两个类，一个工具类。复制下来存为一个 HTML 文件就能看到效果了，在 IE 和 Firefox 效果都是一样的：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
  <meta name="author" content="bao110908" />
  <title>Table</title>
</head><script type="text/javascript">
/**
* 仿 Prototype 的 $ 方法
*/
window.$ = function(id) {
  if(typeof id == 'string') {
    return document.getElementById(id);
  }
  return id;
}/**
* 色彩渐变
* @param start   起始颜色，使用 # 颜色表
* @param end     终止颜色
* @param step    渐变步长，大于 1 并且小于 200，默认为 16
*/
var ColorGradient = function(start, end, step) {
  this.start = this._toRGB(start);
  this.end = this._toRGB(end);
  this.step = (function() {
      if(!step || step < 1 || step > 200) {
        return 16;
      }
      return step;
    })();
  this.gradient = [];
}ColorGradient.prototype = {  // 获得渐变的颜色数组，以 6 位十六进制字符串返回
  getGradient : function() {
    return this._getGradient();
  },  // 获得所设定的步长值
  getStep : function() {
    return this.step;
  },  // 测试工作，用于在页面上渐变测试
  test : function() {
    var grad = this._getGradient();
    var n = 400 / this.step;
    var p = document.createElement('div');
    for(var i = 0; i < grad.length; i++) {
      var d = document.createElement('div');
      d.className = 'grad';
      d.style.width = n + 'px';
      d.style.backgroundColor = '#' + grad[i];
      p.appendChild(d);
    }
    document.body.appendChild(p);
  },  // 生成渐变色数组
  _getGradient : function() {
    if(this.gradient.length > 0)  {
      // 如果渐变色变量中有值直接返回
      return this.gradienth;
    }
    // 生成各步的颜色
    for(var i = 0; i <= this.step; i++) {
      var color = this._getNewColor(i).toString(16);
      while(color.length < 6) {
        color = '0' + color;
      }
      this.gradient.push(color);
    }
    return this.gradient;
  },  // 根据 RGB 变化量获得每步的 RGB 颜色
  _getNewColor : function(k) {
    var rgbStep = this._getStepRgb();
    var rgb = 0;
    for(var i = 0; i < 3; i++) {
      var c = Math.floor(this.start[i] + rgbStep[i] * k);
      rgb |= c << ((3 - i - 1) * 8);
    }
    return rgb;
  },  // 获得 RGB 三种颜色的变化量
  _getStepRgb : function() {
    var rgb = [];
    // 依次获得 R、G、B 的变化步长
    for(var i = 0; i < 3; i++) {
      rgb.push(this._getStepVar(i));
    }
    return rgb;
  },  // 根据渐变步长、起始、终止颜色获得步长的变化量
  _getStepVar : function(index) {
    return (this.end[index] - this.start[index]) / this.step;
  },  // 将 # 颜色转换成 RGB 颜色数组
  // 索引 0 -- 红色 R
  // 索引 1 -- 绿色 G
  // 索引 2 -- 蓝色 B
  _toRGB : function(color) {
    var v = color.substring(1);
    var c = parseInt(v, 16);
    var rgb = [];
    for(var i = 0; i < 3; i++) {
      rgb.push(c >> ((3 - i - 1) * 8) & 0xff);
    }
    return rgb;
  }
}/**
* 事件处理工具类
*/
var Event = function(){}Event = {  /**
   * 为 element 使用 handler 处理程序添加至 event 事件
   * 兼容 IE 及 Firefox 等浏览器
   *
   * 例如为 botton 对象添加 onclick 事件，使用 clickEvent
   * 方法作为处理程序：
   *   Event.addEvent(botton, 'click', clickEvent);
   *
   * @param element  需要添加事件的对象（Object）
   * @param event    需要添加的事件名称（String），不加“on”
   * @param handler  需要添加的方法引用（Function）
   */
  addEvent : function(element, event, handler) {
    if(element.attachEvent) {
      element.attachEvent('on' + event, handler);
    } else if (element.addEventListener) {
      element.addEventListener(event, handler, false);
    } else {
      element['on' + event] = handler;
    }
  },  /**
   * 添加事件处理程序时，只能添加一个方法的引用，并不能给
   * 方法加上参数。比如定义了 clickEvent(str) 这个方法，现
   * 在要将其作为 obj 的 onclick 的事件处理程序，就可以用：
   * obj.onclick = Event.getFuntion(null, clickEvent, str);
   */
  getFunction : function(obj, fun) {
    var args = [];
    obj = obj || window;
    for(var i = 2; i < arguments.length; i++) {
      args.push(arguments[i]);
    }
    return function() {
        fun.apply(obj, args);
      };
  }
}/**
* 背景渐隐表格类
* @param id  表格的 id
* @param time  渐隐时间
* @param start  起始颜色
* @param end  终止颜色
*/
var Table = function(id, time, start, end) {  /**
   * 表格中的行集
   */
  this.rows   = (function() {
      var tab = $(id);
      if(tab.tBodies.length == 0) {
        return tab.rows;
      }
      var rows = [];
      for(var i = 0; i < tab.tBodies.length; i++) {
        for(var j = 0; j < tab.tBodies[i].rows.length; j++) {
          rows.push(tab.tBodies[i].rows[j]);
        }
      }
      return rows;
    })();
  this.start  = start || Table.DEFAULT_START;
  this.end    = end || Table.DEFAULT_END;
  this.time   = time || Table.DEFAULT_TIME;  // 渐变对象
  var color = new ColorGradient(this.start, this.end, 16);  /**
   * 渐变梯度
   */
  this.grad   = color.getGradient();  /**
   * 渐变步长
   */
  this.step   = color.getStep();
}// 默认延迟时间（毫秒）
Table.DEFAULT_TIME = 10;
// 默认起始颜色
Table.DEFAULT_START = '#dcdcdc';
// 默认终止颜色
Table.DEFAULT_END = '#ffffff';Table.prototype = {  /**
   * 添加鼠标滑过时背景渐隐
   */
  addEvent : function() {
    for(var i = 0; i < this.rows.length; i++) {
      this.rows[i].style.backgroundColor = this.end;
      Event.addEvent(this.rows[i], 'mouseover',
          Event.getFunction(this, this.overEvent, this.rows[i]));
      Event.addEvent(this.rows[i], 'mouseout',
          Event.getFunction(this, this.outEvent, this.rows[i]));
    }
  },  /**
   * 鼠标滑过表格行时的处理
   */
  overEvent : function(row) {
    row.style.backgroundColor = this.start;
    row.change = this.step;
  },  /**
   * 鼠标移出表格行时的处理
   */
  outEvent : function(row) {
    var me = this;   // 当前对象引用，用于 setTimeout 闭包中获取对象
    if(row.change-- > 0) {
      row.style.backgroundColor = '#' + me.grad[me.step - row.change];
      // 渐隐处理
      setTimeout(function() {
          me.outEvent(row);
        }, this.time);
    }
  },  _getRows : function(id) {
    var tab = $(id);
    alert(tab.tBodies.length);
  }
}window.onload = function() {
  var tab = new Table('tab', Table.DEFAULT_TIME + 10, Table.DEFAULT_START, Table.DEFAULT_END);
  tab.addEvent();
}
</script><style type="text/css">
div.grad { float: left; height: 100px; margin: 0; padding: 0; }
table { border-top: 1px solid black; border-left: 1px solid black; border-spacing: 0; font-family: 宋体,新宋体; }
table td { border-bottom: 1px solid black; border-right: 1px solid black; padding: 2px 5px; }
</style><body>
<table id="tab" border="0" cellspacing="0">
<tbody>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  <tr>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
    <td>aaaaaaa</td><td>aaaaaaa</td><td>aaaaaaa</td>
  </tr>
  </tbody>
</table>
</body>
</html>

觉得js很难，主要是浏览器兼容性让人头痛，俺是个菜鸟，不过j2ee主要是做大型项目的，比较重要的是后台问题，比如数据库，安全性，性能方面的问题，对于前台页面的重要性没有那么强，js和后台联系不大，如果lz精通js的话当然也可以做管理，那应该是前台的管理吧！小公司比较重视这方面。

js我一直当他是个复杂、有深度的东西，但似乎还是低估他了，呵呵。
js因为调试难、文档少、ide支持不良、浏览器解析差异等问题我一直不喜欢写他，写的也很烂。不过经常会有这么一种想法，假如哪天java没了api文档，没有自动提示自动部署编译的ide支持，全靠txt的话，自己是否也会同样无所适从？
强大的ide似乎掩盖了某些基础薄弱的环节呢。

哎回答的很多看来大家的想法是不要放弃js的多哦！
可是向大家说的java比java跟难？我这么觉得java还难些啊可别吓我

不吓你！有兴趣的话可以去看一下 Prototype, jQuery 的源代码就知道，像 ExtJS、DOJO 的源代码就算了，根本没法看！

问一下  有没有真正看过了jquery代码的啊  赐教一下啊   可否讲一下  此例子是什么意思啊:...prototype.fun = function(){...};//,prototype为什么后面可以跟自己定义的方法不懂
var temp =  {a : "a",b : "b"};     //又是什么意思  还有与上面的那种写法有什么区别啊
还有就是 “$” 号在js中怎么称呼  为什么可以做变量啊！  还有就是  createPoput 中很大一个问题  为什么不能输入还要我定义keyDown事件  连光标都没有！  昏啊没分了在回答了我原本的问题后希望能在回答一下这些问题！！！

项目经理很有可能不太懂技术,他懂的是项目的质量管控,进度管控等. 不过技术NB的项目经理更能让手下的人信服.实际工作中,项目经理可能还要兼销售和技术主管.另外,我不同意javaScript比java复杂的说法. 另外,js的设计目的就是应用在网页中. 一般来说只需要实现功能即可,没有必要花过多的精力去优化它. 当然,你做一个cpu占用率很高的网页也是不对的.个人觉得,如果提高技术,还是深入学习java,c这样的好. 虽然编程用什么语言都可以,但是javaScript的应用是有局限型的,你学javaScript永远不会用它写线程,写网络服务.

呵呵，闭包搞的我要吐血了。用java的再看javascript会很不适应。

调试易

专研 JS 对以后的管理层有阻碍么？

解决方案 »