comment implémenter la réduction des régions/codes en javascript

Question

Comment mettre en œuvre les régions, c'est-à-dire l'effondrement du code, pour JavaScript dans Visual Studio ?

S'il y a des centaines de lignes en javascript, il sera plus compréhensible d'utiliser le pliage de code avec des régions comme en vb/C#.

#region My Code

#endregion

Answer 1

En marquant une section de code (sans tenir compte des blocs logiques) et en appuyant sur les touches CTRL + M + H, vous définirez la sélection comme une région qui est repliable et extensible.

Answer 2

El JSEnhancements pour Visual Studio permet de résoudre ce problème de manière satisfaisante.

Answer 3

Pour ceux qui sont venus ici pour Visual Studio Code la même syntaxe fonctionne

// #region MongoDB Client
const MongoClient = require('mongodb').MongoClient;
const url = constants.credentials["uat"].mongo.url
MongoClient.connect(url, { useUnifiedTopology: true }, function (err, client) {
    if (err) {
        console.log(err);
    }
    else {
        docDB = client.db("middlewareDB");
    }
});
// #endregion

Lorsqu'il est réduit, il ressemble à ce qui suit

Answer 4

Merci à 0A0D pour une excellente réponse. J'ai eu de la chance avec ça. Darin Dimitrov présente également un bon argument pour limiter la complexité de vos fichiers JS. Néanmoins, je trouve des occasions où le fait de réduire les fonctions à leurs définitions facilite la navigation dans un fichier.

En ce qui concerne la #région en général, ceci Question sur le SO le couvre assez bien.

J'ai apporté quelques modifications à la Macro pour supporter un effondrement de code plus avancé. Cette méthode vous permet de mettre une description après le mot-clé //#region comme en C# et l'affiche dans le code comme indiqué :

Exemple de code :

//#region InputHandler
var InputHandler = {
    inputMode: 'simple', //simple or advanced

    //#region filterKeys
    filterKeys: function(e) {
        var doSomething = true;
        if (doSomething) {
            alert('something');
        }
    },
    //#endregion filterKeys

    //#region handleInput
    handleInput: function(input, specialKeys) {
        //blah blah blah
    }
    //#endregion handleInput

};
//#endregion InputHandler

Macro mis à jour :

Option Explicit On
Option Strict On

Imports System
Imports EnvDTE
Imports EnvDTE80
Imports EnvDTE90
Imports System.Diagnostics
Imports System.Collections.Generic

Public Module JsMacros

    Sub OutlineRegions()
        Dim selection As EnvDTE.TextSelection = CType(DTE.ActiveDocument.Selection, EnvDTE.TextSelection)

        Const REGION_START As String = "//#region"
        Const REGION_END As String = "//#endregion"

        selection.SelectAll()
        Dim text As String = selection.Text
        selection.StartOfDocument(True)

        Dim startIndex As Integer
        Dim endIndex As Integer
        Dim lastIndex As Integer = 0
        Dim startRegions As New Stack(Of Integer)

        Do
            startIndex = text.IndexOf(REGION_START, lastIndex)
            endIndex = text.IndexOf(REGION_END, lastIndex)

            If startIndex = -1 AndAlso endIndex = -1 Then
                Exit Do
            End If

            If startIndex <> -1 AndAlso startIndex < endIndex Then
                startRegions.Push(startIndex)
                lastIndex = startIndex + 1
            Else
                ' Outline region ...
                Dim tempStartIndex As Integer = CInt(startRegions.Pop())
                selection.MoveToLineAndOffset(CalcLineNumber(text, tempStartIndex), CalcLineOffset(text, tempStartIndex))
                selection.MoveToLineAndOffset(CalcLineNumber(text, endIndex) + 1, 1, True)
                selection.OutlineSection()

                lastIndex = endIndex + 1
            End If
        Loop

        selection.StartOfDocument()
    End Sub

    Private Function CalcLineNumber(ByVal text As String, ByVal index As Integer) As Integer
        Dim lineNumber As Integer = 1
        Dim i As Integer = 0

        While i < index
            If text.Chars(i) = vbLf Then
                lineNumber += 1
                i += 1
            End If

            If text.Chars(i) = vbCr Then
                lineNumber += 1
                i += 1
                If text.Chars(i) = vbLf Then
                    i += 1 'Swallow the next vbLf
                End If
            End If

            i += 1
        End While

        Return lineNumber
    End Function

    Private Function CalcLineOffset(ByVal text As String, ByVal index As Integer) As Integer
        Dim offset As Integer = 1
        Dim i As Integer = index - 1

        'Count backwards from //#region to the previous line counting the white spaces
        Dim whiteSpaces = 1
        While i >= 0
            Dim chr As Char = text.Chars(i)
            If chr = vbCr Or chr = vbLf Then
                whiteSpaces = offset
                Exit While
            End If
            i -= 1
            offset += 1
        End While

        'Count forwards from //#region to the end of the region line
        i = index
        offset = 0
        Do
            Dim chr As Char = text.Chars(i)
            If chr = vbCr Or chr = vbLf Then
                Return whiteSpaces + offset
            End If
            offset += 1
            i += 1
        Loop

        Return whiteSpaces
    End Function

End Module

Answer 5

Cette fonction est désormais disponible en mode natif dans VS2017 :

//#region fold this up

//#endregion

Les espaces entre le // et le # n'ont pas d'importance.

Je ne sais pas dans quelle version cela a été ajouté, car je ne trouve aucune mention à ce sujet dans les journaux des modifications. Je suis en mesure de l'utiliser dans la version 15.7.3.