Develop a full-stack JavaScript application that visualizes geospatial data on a map using the Leaflet library. The application should allow users to upload GeoJSON files, store them in a PostgreSQL database with PostGIS extension, and display the data on a web-based interactive map. Additionally, implement spatial query functionality for filtering and analyzing the data.
To develop a full-stack JavaScript application that visualizes geospatial data on a map using the Leaflet library, you'll need to follow these steps:

1. Set up your development environment:
   - Install Node.js and npm (Node Package Manager)
   - Install PostgreSQL with PostGIS extension
   - Install an IDE or text editor of your choice

2. Create a new directory for your project and navigate to it in the terminal.

3. Initialize a new Node.js project by running `npm init` and following the prompts.

4. Install necessary dependencies for your project:

```
npm install express pg multer leaflet body-parser cors --save
```

5. Create a new file named `app.js` in your project directory. This will be the main entry point for your application.

6. In `app.js`, set up your Express server and connect to your PostgreSQL database:

```javascript
const express = require('express');
const bodyParser = require('body-parser');
const cors = require('cors');
const multer = require('multer');
const { Pool } = require('pg');

const app = express();
app.use(bodyParser.json());
app.use(cors());

// Connect to PostgreSQL database
const pool = new Pool({
  user: 'your_user',
  host: 'localhost',
  database: 'your_database',
  password: 'your_password',
  port: 5432,
});

pool.on('error', (err) => {
  console.error('Unexpected error on idle client', err);
  process.exit(-1);
});
```

7. Create a route for uploading GeoJSON files:

```javascript
const upload = multer({ dest: 'uploads/' });

app.post('/upload', upload.single('file'), async (req, res) => {
  try {
    const geojson = JSON.parse(req.file.buffer.toString());
    // Store the GeoJSON data in the PostgreSQL database
    // You can use a library like 'node-geojson2pgsql' to convert the GeoJSON data into SQL statements
  } catch (error) {
    res.status(500).send({ error: 'Error processing file.' });
  }
});
```

8. Create a route for retrieving geospatial data from the database and returning it as GeoJSON:

```javascript
app.get('/data', async (req, res) => {
  try {
    const result = await pool.query('SELECT * FROM your_table');
    // Convert the query result to GeoJSON format
    res.send(result.rows);
  } catch (error) {
    res.status(500).send({ error: 'Error fetching data.' });
  }
});
```

9. Implement spatial query functionality by adding additional routes or modifying existing ones.

10. Set up Leaflet in your frontend application:

   - Include the Leaflet CSS and JavaScript files in your HTML file.
   - Initialize a map instance using `L.map()`.
   - Add a base layer using `L.tileLayer()`.
   - Fetch the GeoJSON data from your server and add it to the map using `L.geoJSON()`.

11. Deploy your application to a hosting provider of your choice.

By following these steps, you'll have a full-stack JavaScript application that visualizes geospatial data on a map using the Leaflet library. Users will be able to upload GeoJSON files, store them in a PostgreSQL database with PostGIS extension, and display the data on a web-based interactive map. Additionally, you'll have implemented spatial query functionality for filtering and analyzing the data.