Node初識(shí)


最近出于興趣,開(kāi)始接觸前端開(kāi)發(fā)的相關(guān)知識(shí)。作為前端開(kāi)發(fā)應(yīng)用最廣泛的語(yǔ)言,我目前接觸到的就是JavaScript。在了解了基礎(chǔ)的JS語(yǔ)法后,了解到還有一個(gè)很火的Node.js,于是就懷著好奇的心態(tài),決定先了解了解。


Node是什么?

學(xué)習(xí)JS,我們知道它是一種直譯式腳本語(yǔ)言,通過(guò)解釋器對(duì)代碼進(jìn)行翻譯,并直接運(yùn)行。而解釋器就是JS引擎,它是瀏覽器組成的一部分。
從[Node官網(wǎng)](http://nodejs.cn/)了解到,Node.js是一個(gè)基于 Chrome V8 引擎的 JavaScript 運(yùn)行環(huán)境。
換句話說(shuō),Node 就是一個(gè)JS 的解釋器。可以直接對(duì)JS代碼進(jìn)行翻譯執(zhí)行。


Node安裝

要安裝Node,可以直接從官網(wǎng)下載,也可以利用Node Version Manager(nvm,Node版本管理器)來(lái)安裝。這里推薦使用nvm安裝方式。因?yàn)檫@樣可以使用戶在多種node版本中相互切換,并且可以隨時(shí)更新Node版本。

Mac上安裝nvm
可以通過(guò)brew info nvm來(lái)獲取當(dāng)前可下載的nvm版本,以及下載后需要完成的配置。再通過(guò)brew install nvm完成nvm的安裝。
如下圖:

`brew info 效果圖`

install完成之后根據(jù)info給出的提示進(jìn)行相關(guān)配置就可以了。

當(dāng)nvm安裝成功后,可以通過(guò)在控制臺(tái)輸入nvm來(lái)查看可以使用的指令,以及該指令對(duì)應(yīng)的操作。如下:

安裝成功后輸入`nvm`

從相關(guān)指令表中可以看出,使用nvm ls-remote可以獲得遠(yuǎn)端可下載安裝的node版本。

由于會(huì)列出所有歷史版本,這里只列出部分可利用版本,其中灰色為可安裝版本,藍(lán)色的為本地已安裝版本,綠色為當(dāng)前使用的版本。

之后使用nvm install [<version>]安裝指定版本。

安裝成功

使用nvm ls可以查看當(dāng)前本地所安裝的node版本,以及當(dāng)前使用的node版本

本地node版本

這樣,node安裝就完成了。另外,需要注意的是,nvm在安裝node的同時(shí),會(huì)附帶安裝npm(Node Package Manager,node包管理器),
npm可以解決JS代碼下載第三方包在本地使用的問(wèn)題,在node.js項(xiàng)目中會(huì)很用。

npm

如此一來(lái),Node所需的基本環(huán)境就安裝完成了。


Node的使用

node指令的使用可以用來(lái)解釋執(zhí)行一個(gè)已有的JS文件,如我有如下main.js文件:

var Student = require('../src/Student')
var Person = require('../src/Person')

var std1 = new Student("Frank", "Kaiser", "male", 25, 89757);
var person1 = new Person("Oliver", "Queen","male", 30);

console.log("\n");
console.log("This is a Student:");
console.log(std1.toString());
console.log("\n");
console.log("This is a Person:");
console.log(person1.toString());
console.log("\n");
console.log("Is student instance of Person class?");
console.log(std1 instanceof Person);

那么通過(guò)控制臺(tái)的node src/main.js指令,就可以得到:

`node`指令運(yùn)行JS文件的結(jié)果

除了可以直接運(yùn)行.js文件外,node指令還可以在控制臺(tái)直接輸入JS代碼,進(jìn)行解釋執(zhí)行。

`node`直接打開(kāi)JS代碼解釋器

至此,node的簡(jiǎn)單使用方式也就了解了。


理解Node模塊化概念

以往的js代碼并沒(méi)不重視模塊化這一概念,使得一些變量很容易就被“污染”,安全性也會(huì)大打折扣。
而在Node中,推薦將不同的功能組件劃分成不同的模塊,這種模塊其實(shí)有點(diǎn)類似Java中的封裝概念,每個(gè)模塊會(huì)向外暴露一些公共方法或?qū)傩?,從而使得這些模塊可以被按照需求調(diào)用或移除。
那么如何使用模塊呢?
類似于Java中的package引入,在Node中,可以使用require(path)全局函數(shù)來(lái)加載已經(jīng)寫好的模塊文件,其中的參數(shù)為模塊文件的路徑,就如上文代碼中的

var Student = require('../src/Student')
var Person = require('../src/Person')

就是引入了Student和Person兩個(gè)模塊。
但是需要注意的是在這兩個(gè)模塊中,應(yīng)該都包含
module.exports = <moduleName>這樣的語(yǔ)句。
下面給出Person和Student模塊的代碼:

//Person模塊代碼
function Person(first, last, gender, age) {
  this.first = first;
  this.last = last;
  this.gender = gender;
  this.age = age;
  console.log("if this log appears twice times,that means Student Class's constructor extends Person Class's constructor.");
}

Person.prototype.getName = function(){
  var name = {
    'first' : this.first,
    'last' : this.last
  }
  return name;
}
Person.prototype.getGender = function(){
  return this.gender;
}
Person.prototype.getAge = function(){
  return this.age;
}
Person.prototype.toString = function (){
  return 'Name: ' + this.getName().first + '·' + this.getName().last +',\n' +'Gender: ' + this.gender + ',\n' + 'Age: '+ this.age + '.'
}

module.exports = Person;
//Student模塊代碼
var Person = require('../src/Person');

function Student(first, last, gender, age, stdId){
  Person.call(this, first, last, gender, age);
  this.stdId = stdId;
}

Student.prototype = Object.create(Person.prototype);
Student.prototype.construct = Student;

//Student.prototype = new Person();

Student.prototype.setStdId = function (stdId){
  this.stdId = stdId;
}
Student.prototype.getStdId = function (){
  return this.stdId;
}
Student.prototype.toString = function (){
  return 'Name: ' + this.getName().first + '·' + this.getName().last +',\n' +'Gender: ' + this.gender + ',\n' + 'Age: '+ this.age + ',\n' + 'StudentId: ' + this.stdId + '.';
}

module.exports = Student;

當(dāng)然,模塊化的JS代碼除了這里提到的有利于書(shū)寫可伸縮的代碼,同時(shí)就是提供了前面所說(shuō)的類似于面向?qū)ο缶幊痰摹胺庋b”特性。
即在模塊中直接聲明的變量,是無(wú)法在模塊外調(diào)用的,如在Person模塊中添加一個(gè)name變量,則在main.js中,雖然引入了Person模塊,但并無(wú)法通過(guò)<instanceName>.name調(diào)用。若需要直接使用這個(gè)變量,則需要將其與this綁定,或?qū)⑵溆迷头椒òb。
如下:

在Person模塊中添加一個(gè)name變量.png
在main.js中添加上圖代碼

運(yùn)行結(jié)果:

直接調(diào)用name,則顯示undifined.png

總結(jié)

其實(shí)Node還有很多強(qiáng)大的功能,只是我還了解的不多。之后要學(xué)的還很多。
另外,添上一篇更為詳盡的博客作為參考資料。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容