翻譯自?jsdiff?

JavaScript文本內容差異實現。

基于"An O(ND) Difference Algorithm and its Variations" (Myers, 1986)?中提出的算法 。

安裝

npm install diff --save

API

• Diff.diffChars(oldStr, newStr[, options])?-區分兩個文本塊，逐字符比較。

  返回更改對象列表（請參見下文）。

  選件

  • ignoreCase：true忽略大小寫差異。默認為false。

• Diff.diffWords(oldStr, newStr[, options])?-區分兩個文本塊，逐字比較，忽略空格。

  返回更改對象列表（請參見下文）。

  選件

  • ignoreCase：與中的相同diffChars。

• Diff.diffWordsWithSpace(oldStr, newStr[, options])?-區分兩個文本塊，逐字比較，將空白視為有效。

  返回更改對象列表（請參見下文）。

• Diff.diffLines(oldStr, newStr[, options])?-比較兩個文本塊，逐行比較。

  選件

  • ignoreWhitespace：true忽略開頭和結尾的空格。這和diffTrimmedLines
  • newlineIsToken：true將換行符視為單獨的標記。這允許換行結構的更改獨立于行內容而發生，并照此處理。一般來說，這是更加人性化友好的形式diffLines和diffLines更適合貼片機等計算機友好的輸出。

  返回更改對象列表（請參見下文）。

• Diff.diffTrimmedLines(oldStr, newStr[, options])?-區分兩個文本塊，逐行比較，忽略前導和尾隨空格。

  返回更改對象列表（請參見下文）。

• Diff.diffSentences(oldStr, newStr[, options])?-區分兩個文本塊，逐句比較。

  返回更改對象列表（請參見下文）。

• Diff.diffCss(oldStr, newStr[, options])?-比較兩個文本塊，比較CSS標記。

  返回更改對象列表（請參見下文）。

• Diff.diffJson(oldObj, newObj[, options])-比較兩個JSON對象，比較每個對象上定義的字段。在此比較中，字段的順序等并不重要。

  返回更改對象列表（請參見下文）。

• Diff.diffArrays(oldArr, newArr[, options])?-比較兩個數組，比較每個項目是否嚴格相等（===）。

  選件

  • comparator：function(left, right)用于自定義相等性檢查

  返回更改對象列表（請參見下文）。

• Diff.createTwoFilesPatch(oldFileName, newFileName, oldStr, newStr, oldHeader, newHeader)?-創建一個統一的差異補丁。

  參數：

  • oldFileName?：將在修補程序的文件名部分中輸出的字符串，以供刪除
  • newFileName?：要在增補程序的文件名部分中輸出的字符串
  • oldStr?：原始字符串值
  • newStr?：新的字符串值
  • oldHeader?：舊文件標題中包含的其他信息
  • newHeader?：新文件頭中包含的其他信息
  • options：帶有選項的對象。當前，僅context支持，并且描述應包括多少行上下文。

• Diff.createPatch(fileName, oldStr, newStr, oldHeader, newHeader)?-創建一個統一的差異補丁。

  就像Diff.createTwoFilesPatch一樣，但是oldFileName等于newFileName。

• Diff.structuredPatch(oldFileName, newFileName, oldStr, newStr, oldHeader, newHeader, options)?-返回帶有大塊對象數組的對象。

  此方法類似于createTwoFilesPatch，但是返回適合進一步處理的數據結構。參數與createTwoFilesPatch相同。返回的數據結構可能如下所示：

  {oldFileName: 'oldfile', newFileName: 'newfile',oldHeader: 'header1', newHeader: 'header2',hunks: [{oldStart: 1, oldLines: 3, newStart: 1, newLines: 3,lines: [' line2', ' line3', '-line4', '+line5', '\\ No newline at end of file'],}] }

  ?

• Diff.applyPatch(source, patch[, options])?-應用統一的差異補丁。

  返回一個字符串，其中包含提供的數據的新版本。patch可以是字符串diff或parsePatchor?structuredPatch方法的輸出。

  可選options對象可能具有以下鍵：

  • fuzzFactor：拒絕補丁之前允許變化的行數。默認為0。
  • compareLine(lineNumber, line, operation, patchContent)：回調用于與給定的行進行比較，以確定修補時是否應將它們視為相等。默認為嚴格相等，但可以被覆蓋以提供更模糊的比較。如果應拒絕行，則應返回false。

• Diff.applyPatches(patch, options)?-應用一個或多個補丁。

  此方法將迭代補丁程序的內容，并應用于通過回調提供的數據。每個補丁程序索引的一般流程為：

  • options.loadFile(index, callback)叫做。然后，調用方應加載文件的內容，然后將其傳遞給callback(err, data)回調。傳遞err將會終止進一步的補丁程序執行。
  • options.patched(index, content, callback)一旦應用了補丁，就會調用。content將是的返回值applyPatch。準備就緒后，調用方應調用callback(err)回調。傳遞err將會終止進一步的補丁程序執行。

  一旦應用了所有補丁或發生錯誤，便進行options.complete(err)回調。

• Diff.parsePatch(diffStr)?-將補丁解析為結構化數據

  返回補丁的JSON對象表示形式，適合與applyPatch方法一起使用。這將解析為返回的相同結構Diff.structuredPatch。

• convertChangesToXML(changes)?-將更改列表轉換為序列化的XML格式

callback當省略該參數時，上面所有接受可選方法的方法將在同步模式下運行，而在提供該參數時將在異步模式下運行。這允許更大的差異而不阻塞事件循環。這可以直接作為最終參數或作為對象中的callback字段傳遞options。

變更物件

上面的許多方法都返回更改對象。這些對象包含以下字段：

• value：文字內容
• added：如果將值插入到新字符串中，則為True
• removed：如果從舊字符串中刪除了值，則為true

請注意，某些情況下可能會省略特定的標志字段。對標記字段的比較應始終以真實或錯誤的方式進行。

例子

Node中的基本示例

require('colors'); var Diff = require('diff');var one = 'beep boop'; var other = 'beep boob blah';var diff = Diff.diffChars(one, other);diff.forEach(function(part){// green for additions, red for deletions// grey for common partsvar color = part.added ? 'green' :part.removed ? 'red' : 'grey';process.stderr.write(part.value[color]); });console.log();

運行上面的程序應該會產生

?

網頁中的基本示例

<pre id="display"></pre> <script src="diff.js"></script> <script> var one = 'beep boop',other = 'beep boob blah',color = '',span = null;var diff = Diff.diffChars(one, other),display = document.getElementById('display'),fragment = document.createDocumentFragment();diff.forEach(function(part){// green for additions, red for deletions// grey for common partscolor = part.added ? 'green' :part.removed ? 'red' : 'grey';span = document.createElement('span');span.style.color = color;span.appendChild(document.createTextNode(part.value));fragment.appendChild(span); });display.appendChild(fragment); </script>

在瀏覽器中打開上述.html文件，您應該看到

?

完整的在線演示

jsdiff支持IE8及以下版本中存在某些已知問題的所有ES3環境。在這些瀏覽器下，某些差異算法（例如單詞diff）和其他差異算法可能會由于缺乏對捕獲split操作中組的支持而失敗。

總結

以上是生活随笔為你收集整理的jsdiff 比较文本内容差异的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。