Javascript tooling: how complex refactoring is possible right now?

Question

Coming from Java where most IDE supports complex refactoring which can span more source code files and projects, i wonder if there's any Javascript editors which support the same?

I've just finished watching some presentation about Cloud9's AST tooling support. This presentation is more than one year old. I wonder if since then Cloud9 got complex refactoring functions which understand eg. the NodeJs require() statments? Of course this question doesn't want to narrow to Cloud9, we have brackets.io, Orion, etc. This is just the presentation i came across so that's why i'm giving examples based on Cloud9.

Say i have a Node module which exports an object prototype, and i have an another module which uses this. Say i like to rename a function in the exported prototype and what i'm looking for is that the IDE will refactor the calls in the other module according to the change. Does any tool supports refactor renaming across module dependencies?

Answer 1

I waste a lot of time to find a solution for that but...

I think there are no exist application like you want. JavaScript is a little bit strange language for that. For example scoping. It's hard to detect function calls because it's hard to detect your current variable is an instance/clone of an other or not, hard to detect changes in prototype. You have a "class", create a new instance and your can change properties for only this new instance. Of course the "this" keyword could be a new problem with scopes.

An example. If I rename addNew function, what would be renamed too?

var Sample = function() {
    this.values = [];
};
Sample.prototype.addNew = function(value) {
    this.values.push(value);
};

var s = new Sample();
s.addNew("1");

var s2 = new Sample();
s2.addNew = function(value) {
    this.values.push(parseInt(value, 10));
};
s2.addNew("12x");

Sample.prototype.addNewRaw = Sample.prototype.addNew;
Sample.prototype.addNew = function(value) {
    this.values.push("x" + value);
};

var s3 = new Sample();
s3.addNew(12);
s3.addNewRaw(12);

console.log(s);
console.log(s2);
console.log(s3);

Ok it's a terrible code :) If I met this code by my co-worker I think, I just hit them until he looks like this one. Yes it's an interesting topic/question and I think the "Is it possible and it could be useable?" question is the first that we need to ask. Of course possible and that can be useable.

Btw, I use Brackets, sed, grep and jshint in general and refactoring too.

Answer 2

In our company, we use Webstorm to do refactoring for our nodejs project. Webstorm is the best IDE for nodejs IMHO.

The reason is that it can have code analysis done using Lint and many other modules. After code analysis, we were able to solve a lot of coding mistakes and reduce many malpractices.

Changes done to file name or method name will invoke a whole project scan and prompt you how many references are automatically corrected.

Webstorm also supports a lot of Vim features such as quick jumping between codes and a lot of nice keyboard shortcuts. In fact, I pinned a shortcut cheatsheet for webstorm on my wall.

Here is the link to Webstorm