comment mettre en œuvre les régions / effondrement de code en javascript

Question

Comment pouvez-vous mettre en œuvre les régions effondrement de code JavaScript pour a.k.a. Visual Studio?

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

#region My Code

#endregion

Answer 1

entrée Blog explique ici cette question MSDN .

Vous devez utiliser Visual Studio 2003/2005/2008 macros.

Copier + Coller dans l'entrée de blog pour l'amour de la fidélité:

1. Ouvrez l'Explorateur de macros
2. Créer une nouvelle macro
3. Nom il OutlineRegions
4. Cliquez sur Modifier macro et collez le code VB suivant:

Option Strict Off
Option Explicit Off

Imports System
Imports EnvDTE
Imports EnvDTE80
Imports System.Diagnostics
Imports System.Collections

Public Module JsMacros

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

        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 Stack = New Stack()

        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 ...
                selection.MoveToLineAndOffset(CalcLineNumber(text, CInt(startRegions.Pop())), 1)
                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)
        Dim lineNumber As Integer = 1
        Dim i As Integer = 0

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

            i += 1
        End While

        Return lineNumber
    End Function

End Module

5. Enregistrez la macro et fermez l'éditeur
6. Maintenant, nous assignons raccourci à la macro. Outils-> Options-> Environnement-> Clavier et rechercher votre macro dans « commandes show contenant » zone de texte
7. maintenant en zone de texte sous les « touches de raccourci de presse », vous pouvez saisir le raccourci souhaité. J'utilise Ctrl + M + E. Je ne sais pas pourquoi - je viens entrai première fois et l'utiliser maintenant:)

Answer 2

Microsoft a maintenant une extension pour VS 2010 qui offre cette fonctionnalité:

JScript Extensions Editor

Answer 3

De bonnes nouvelles pour les développeurs qui travaillent avec la dernière version de Visual Studio

Web Essentials viennent avec cette fonctionnalité.

Check this out

Note: Pour VS 2017 utilisation JavaScript Régions: https: //marketplace.visualstudio.com/items?itemName=MadsKristensen.JavaScriptRegions

Answer 4

Cest facile!

Marquer la section que vous souhaitez réduire et,

  

Ctrl + M + H

Et d'étendre l'utilisation marque '+' à sa gauche.

Answer 5

Pour ceux sur le point d'utiliser le studio visuel 2012, existe Web Essentials 2012

Pour ceux sur le point d'utiliser le studio visuel 2015, existe Web Essentials 2015,3

L'utilisation est exactement comme demandé @prasad

Answer 6

En marquant une section de code (quels que soient les blocs logiques) et en appuyant sur CTRL + M + H vous allez définir la sélection comme une région qui est repliable et extensible.

Answer 7

Le plugin de JSEnhancements pour les adresses Visual Studio ce bien.

Answer 8

Merci 0A0D pour une excellente réponse. J'ai eu bonne chance avec elle. Darin Dimitrov fait également un bon argument de limiter la complexité de vos fichiers JS. Pourtant, je trouve des occasions où l'effondrement des fonctions à leurs définitions rend la navigation dans un fichier beaucoup plus facile.

En ce qui concerne #region en général, cette SO Question couvre très bien.

Je l'ai fait quelques modifications à la macro pour soutenir l'effondrement de code plus avancé. Cette méthode vous permet de mettre une description après le mot-clé // n région ala C # et il montre 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

Mise à jour Macro:

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 9

Il est maintenant en mode natif dans VS2017:

//#region fold this up

//#endregion

entre le // espace blanc et # n'a pas d'importance.

Je ne sais pas quelle version cela a été ajouté, que je ne trouve aucune mention dans les changelogs. Je suis en mesure de l'utiliser dans v15.7.3.

Answer 10

Le VS 2012 et VS 2015 installer plugin WebEssentials et vous serez en mesure de le faire.

http://vswebessentials.com/features/javascript

Answer 11

si vous utilisez ReSharper

en jachère les étapes de cette image

puis l'écrire dans l'éditeur de modèle

  //#region $name$
$END$$SELECTION$
  //#endregion $name$

et nommez-#region comme dans cette image

espère que cela vous aide

Answer 12

Aucune de ces réponses ne fonctionne pas pour moi avec visual studio 2017.

Le meilleur plugin pour VS 2017: régions JavaScript

Exemple 1:

Exemple 2:

Testé et approuvé:

Answer 13

Pour Visual Studio 2017.

    //#region Get Deactivation JS
    .
    .
    //#endregion Get Deactivation JS

Ce ne fonctionnait pas auparavant, donc je téléchargé l'extension de

Answer 14

Région devrait fonctionner sans modifier les paramètres

//#region Optional Naming
    var x = 5 -0; // Code runs inside #REGION
    /* Unnecessary code must be commented out */
//#endregion

Pour permettre l'effondrement de la zone commentaire / ** /

/* Collapse this

*/

Paramètres -> Rechercher "pliage" -> Editeur: Stratégie de pliage -> De "auto" à "retrait"

.

: Node.js NodeJS Noeud js Javascript ES5 ECMAScript commentaire pliage région cachette Code Visual Studio vscode version 2018 1.2+ https://code.visualstudio.com/updates/v1_17#_folding-regions

Answer 15

Non seulement pour VS mais presque pour tous les éditeurs.

(function /* RegionName */ () { ... })();

Attention:. présente des inconvénients tels que la portée