Node.js 簡単なページ出力実装 code_javascript スキル

インストールプロセスには入りません。成功した場合は、node コマンドを使用できます。 Node.js のデバッグは非常に便利です。各バックエンド言語には、ダーク コンソール グループに出力する実用的なコマンドがあります。 node.js は、FF のセット、つまりコンソール オブジェクトとそのメソッドに従います。まず、次の内容を含む example.js ファイルを作成し、それをコンソールで開きます。

コードをコピー コードは次のとおりです。

console.log("hello node.js ")
for(var i in console){
console.log(i " " console[i])
}
node example.js。

node.js のデバッグには、alert を使用しないでください。これはブラウザーが提供するグローバル メソッドです。エラーが報告されないのはおかしいでしょう。
出力結果は次のとおりです:

コードをコピーします コードは次のとおりです:

var log = function () {
process.stdout.write(format.apply(this, argument) 'n');
}
var info = function () {
process.stdout .write(format.apply (this, argument) 'n');
}
var warn = function () {
writeError(format.apply(this, argument) }
var error = function () {
writeError(format.apply(this, argument) 'n');
}
var dir = function (object) {
var util = require('util' );
process.stdout.write(util.inspect(object) 'n');
}
var time = function (label) {
times[label] = Date.now() ;
}
var timeEnd = function (label) {
var period = Date.now() - 回
exports.log('未定義: NaNms ', label, period) ;
}
var trace = function (label) {
//
// が公開されたら、おそらく TODO は V8 のデバッグ オブジェクトを使用してより適切に実行できるでしょう。 >var err = 新しいエラー ;
err.name = ラベル ||
Error.captureStackTrace(err, argument.callee); error(err.stack) ;
}
varassert = function (expression) {
if (!expression) {
var arr = Array.prototype.slice.call(arguments, 1);
require('assert').ok(false, format.apply(this, arr));
}
}


これらの関数を通じて、そのノードを大まかに理解します。 .js はグローバル スコープにあります。 require や process など、追加されたもの。ただし、一定範囲の私的オブジェクトである可能性があるため、恣意的に言うことはできません。ただし、これらのグローバル オブジェクトを理解し、これらのオブジェクトから他のオブジェクトを理解することは、node.js の生態学的構造を理解するのに非常に役立ちます。フロントエンドでは、ブラウザがアップグレードされるたびに、ウィンドウ オブジェクトとその要素ノードを走査して追加されたメソッドと属性を確認し、ドキュメントを確認します。これらの変更ログからすべての詳細を知ることは不可能です。他の人よりも詳しく知るためには、自分で確認する必要があります。さて、node.js のグローバル オブジェクトを見つけてみましょう。
node.js のドキュメントには、次のグローバル オブジェクトがあることが記載されています:
global, process, require,__filename,__dirname, module

しかし、なぜ console.log を直接使用できるのでしょうか?経験上、コンソールは、alert や window.alert と同様に、グローバル オブジェクトのメンバーでなければなりません。さて、名前 global をトラバースして、非常に横暴なオブジェクトを取得しましょう




コードをコピーします

コードは次のとおりです: for(var i in global){ console.log("var " i " = " global[i])

}

結果は次のようになります:

コードをコピー

コードは次のとおりです: var global = [オブジェクト グローバル] var process = [オブジェクト EventEmitter ]

var GLOBAL = [オブジェクト グローバル]

var root = [オブジェクト グローバル]
var Buffer = function Buffer(subject, encoding, offset) {
//長すぎるため、
を省略します }
var setTimeout = function () {
var t = NativeModule.require('timers');
return t.setTimeout.apply(this, argument); >}
var setInterval = function () {
var t = NativeModule.require('timers');
return t.setInterval.apply(this, argument); clearTimeout = function () {
var t = NativeModule.require('timers');
return t.clearTimeout.apply(this, argument);
var clearInterval = function () {
var t = NativeModule .require('timers');
return t.clearInterval.apply(this, argument);
}
var console = [オブジェクト オブジェクト]


グローバルには、ブラウザウィンドウと同様に、それ自体を指す同じ名前のメンバーがあることがわかります。ウィンドウ === ウィンドウ.ウィンドウ、グローバル === グローバル.グローバル。ただし、node.js は初期の段階では適切に設計されておらず、別の冗長な GLOBAL メンバーが作成されました。
console.log(global === global.global)//true
console.log(global === global.GLOBAL)//true
次にモジュール オブジェクトをスキャンします:

コードをコピー コードは次のとおりです:

for(var i in module){
console。 log("var " i " = " module[i])
}

結果は次のようになります:

コードをコピー コードは次のとおりです:

var id = .
var exports = [object Object]
varparent = null
var filename = /home/cheng19840218/node/example.js
var ロード = false
var exited = false
var Children =
var paths = /home/cheng19840218/node/node_modules,/home/cheng19840218 /node_modules,/home/node_modules,/node_modules
varload = function (filename) {
//長すぎるため省略
}
var _compile = function (content, filename) {
//長すぎるので省略します
}

有名なエクスポートがここで提供されていることがわかり、__filename はおそらく filename への参照です。ざっと読んでみると、たくさんの興味深いことがわかります。しかし、秘密がすぐに暴露されるとは思わないでください。まだ通過できない属性がたくさんあります。たとえば、上記のグローバル オブジェクトを調べましたが、数えることができるメンバーは少数です。ecma262v5 の新しいメソッドを使用して確認できます。
console.log(Object.getOwnPropertyNames(global))
結果は次のとおりです。

コードをコピー コードは次のとおりです:

[ 'clearInterval',
'TypeError'、
'decodeURI'、
'Buffer'、
'parseFloat'、
'Number'、
'URIError'、
'encodeURIComponent'、
'RangeError'、
'ReferenceError'、
'RegExp'、
'Array'、
'isNaN'、
'setTimeout'、
'console'、
'日付'、
' 無限大'、
'ブール'、
'エラー'、
'ルート'、
'NaN'、
'文字列'、
' Function'、
'Math '、
'未定義'、
'encodeURI'、
'escape'、
'unescape'、
'process'、
'decodeURIComponent '、
'EvalError' 、
'clearTimeout'、
'GLOBAL'、
'setInterval'、
'SyntaxError'、
'Object'、
'eval' ,
'global',
'parseInt',
'JSON',
'isFinite' ]

多くの人は、node.js を学習し、すぐにドキュメントを読みます。 Node.js 自体が依存していることはほとんど知られていません。V8 エンジンには、ecma262v5 によってもたらされた新しいメソッドやオブジェクト、Firefox を模倣する構文など、学ぶべきことがたくさんあります。
__defineGetter__
__defineSetter__
__lookupGetter__
__lookupSetter__
set
get
__proto__
ただし、set や get などの最新のブラウザー (IE9 など) ではこれをサポートすることはお勧めしません。以下の開発者ツールで試すことができます:

コードをコピー コードは次のとおりです:

var a = {
get 最新 () {
if (this.log.length > 0) {
return this.log[this.log.length - 1]; }
else {
return null ;
}
},
log: []
}
a.log[0] = "a"; .log[1] = "b";
console.log(a.latest)


基本的に、node.js には互換性の問題はありません (初期のノードからプレイしていない場合) .js）、非常に多くのネイティブ オブジェクトが追加されており、node.js に付属のライブラリと組み合わせて、各モジュールがさまざまな API を提供しています。それだけでは不十分な場合は、github に何千ものプラグインがあります。これは、バックエンド プログラミングに挑戦したい JSers にとって非常に魅力的です。バックエンドにはデータベース操作が含まれるのではないかと言う人もいるかもしれません。これは、フロントエンドの DOM 互換性に比べれば何でもありません。他のフォルダーやファイルの操作については、特別な配列操作として扱ってください。だからあなたは怒られるかもしれません！

さて、本題に入りましょう。 Node.js はもともと http サーバーであり、フロントエンドと対話するため、リクエストとレスポンスの 2 つのオブジェクトが不可欠です。フロントエンドがいつリクエストを送信するかがわからないため、リクエストとレスポンスは明らかに非同期です。また、ログ、データベースの読み取りと書き込み、その他の操作も行う必要があります。 。したがって、JavaScript の場合、これはコールバック関数を使用するのが最適です。では、誰がこのコールバックを受け入れるのでしょうか?サーバーオブジェクトです！

コードをコピー コードは次のとおりです:

var http = require("http");
http.createServer(function(request, response) {
response.writeHead(200, {"Content-Type": "text/plain) "});
response.write("Hello node.js");
response.end();
}).listen(8888);

ノード。 js には特別な require があり、他のモジュールからオブジェクトを同期的に読み込むために使用されます。これは、他の言語の require および import に似ています。フロントエンドと違ってレイヤーごとに同期できると良いですね。次に、関数を使用してサーバー オブジェクトをインスタンス化し、ポート 8888 をリッスンします。これは、node.js 公式 Web サイトにあるオリジナルの例ですが、誰もがそれを悪く書いています。しかし、そのようなプログラムは実際には役に立ちません。アドレス バーに URL を入力するときは、少なくとも完全なページを私に返さなければなりません。
このためには、まずモジュール化する必要があります。モジュール化はファイルに基づいて行われます。example.js の名前をserver.js に変更し、内部のコンテンツをモジュールに変更します。 node.js ファイルの場合、ファイル内のコンテンツは実際には閉じられた環境で実行されます。他のモジュールと共有したい場合は、exports オブジェクトにバインドする必要があります。

コードをコピー コードは次のとおりです。

var http = require("http") ;
exports.start = function(){
http.createServer(function(request, response) {
console.log("リクエストを受信しました...");
response.writeHead(200) , {" Content-Type": "text/plain"});
response.write("Hello node.js");
response.end()
}); ;
console.log("server start...");
}

次に、入り口として別のindex.jsを構築します(index.jsとserver.jsが配置されています)同じディレクトリ内)。

コードをコピーします コードは次のとおりです。

var server = require("./server ");
server.start();

次に、index.html ページを作成します。

コードをコピーします コードは次のとおりです。

>

これはホームページです



このページが出てきてユーザーに返します。今回はfsモジュール方式を使用します。

コードをコピー

コードは次のとおりです。 var http = require("http") ; var fs = require('fs');

exports.start = function(){

http.createServer(function(request, response) {
fs.readFile('./index) .html' , 'utf-8',function (err, data) {//Read content
if (err) throw err;
response.writeHead(200, {"Content-Type": "text/ html" }); //ここに注意してください
response.write(data);
response.end();
});
}).listen(8888);
コンソール。 log( "server start...");
}


それでは、再起動してアドレスを再度入力すると、完全なページが表示されます。
しかし、HTML 構造層に加えて、ページには JavaScript と CSS も含まれています。次に、現在のディレクトリに javascripts フォルダーを作成し、その中にindex.js を作成します。内容は次のとおりです。

コード

をコピーします。 コードは次のとおりです。 window.onload = function(){ var p = document.createElement("p");

p.innerHTML = "This動的に追加されます"

document .body.appendChild(p);
}


別のstylesディレクトリを作成し、その中にindex.cssを作成します。内容は次のとおりです:

コードをコピーします

コードは次のとおりです: html,body{ background: #3671A5 ;

height: 100%

}


次に、index.html に次の 2 つのファイルを導入します。

コードをコピーします

コードは次のとおりです:

" http-equiv="X-UA-互換"/>

< link type="text/css" rel="stylesheet" href="styles/index.css"/>
>

これはホームページです

再度開いたところ、変化がないことがわかりました。Google は、js および css ファイルのリクエストを処理する必要があると述べました。 request.url 属性を取得してサフィックス名を決定し、ファイルを読み取り、そのヘッダーを設定する方法はありません。




コードをコピー

コードは次のとおりです。

var http = require("http") ; var fs = require('fs'); var url = require('url'); exports.start = function(){ http.createServer(function(リクエスト, レスポンス) ) {

var pathname = url.parse(request.url).pathname;

var ext = pathname.match(/(.[^.] |)$/)[0];//サフィックスを取得しますname
switch(ext){
case ".css":
case ".js":
fs.readFile("." request.url, 'utf-8',function (err , data) { //コンテンツを読み取ります
if (err) throw err;
response.writeHead(200, {
"Content-Type": {
".css":"text/css ",
".js":"application/javascript",
}[ext]
});
response.write(data);
response.end();
}) ;
break;
デフォルト:
fs.readFile('./index.html', 'utf-8',function (err, data) {//内容を読み取ります
if (err ) throw err;
response.writeHead(200, {
"Content-Type": "text/html"
}); .end ();
});
}
}).listen(8888);
console.log("サーバーの起動..."); 🎜>


この時点で、この記事の目的は達成されました。通常の js ファイル、css ファイル、html ファイルの 3 つの node.js ファイル。次の目的は複数のページです。 Web サイトは複数の目的で構成されます。これには、ajax リクエストの処理、ファイルのアップロード、セッションと Cookie のサポート、ログ、MIME 認識、ルーティング ディスパッチ、キャッシュ システムなど、やるべきことがたくさんあるため、すぐにフレームワークを開始する人もいます。それは、API に慣れる前に JS を学習して jQuery を使用するようなものです。上記のserver.jsの中間部分を振り返ると、実際にはMIMEとルーティングを分離する必要があります。しかし、最も重要なことは、この無限の関数の入れ子にどのように対処するかということです。これは私のモジュールロードシステムと変わらないと思うので、次回はここから始めます。