[Vue 3] بیان تابع در مقابل اعلان تابع در تنظیم اسکریپت

    function greet(name) {
      console.log(`Hello, ${name}!`);
    }

    greet("stranger"); // prints "Hello, stranger!"

    function greet(name) {
      console.log(`Hello, ${name}!`);
    }

    const greet = function() {
      console.log("Hello!");
    };

    const greet = () => {
      console.log("Hello!");
    };

    greet("stranger"); /* "ReferenceError: 
                           Cannot access 'greet' before 
                           initialization  */

    const greet = function(name) {
      console.log(`Hello, ${name}!`);
    }

    <button id="myButton">Click me!</button>

    <script>
      const myButton = document.querySelector('#myButton');

      myButton.addEventListener('click', function() {
        console.log('Button clicked!');
      });
    </script>

    <script setup>
    import { debounce } from "debounce";
    import { ref, watch } from "vue";

    const searchTerm = ref("");
    const products = ref([]);

    watch(searchTerm, debounce(performSearch, 600));

    async function performSearch() {
      if (searchTerm.value === "") {
        products.value = [];
            return;
      }
      if (searchTerm.value.length < 2) {
        return;
      }
      const searchUrl = getSearchUrl();
      const response = await (await fetch(searchUrl)).json();
      products.value = response.products;
    }

    function getSearchUrl() {
      const url = "https://dummyjson.com/products/search";
        const params = {
        q: searchTerm.value,
            limit: "5"
      };
      const searchParams = new URLSearchParams(params);
      return `${url}?${searchParams}`;
    };

    function clearSearch() {
      searchTerm.value = "";
      products.value = [];
    }

    </script>

    <script setup>
    import { debounce } from "debounce";
    import { ref, watch } from "vue";

    const searchTerm = ref("");
    const products = ref([]);

    const performSearch = async () => {
      if (searchTerm.value === "") {
        products.value = [];
            return;
      }
      if (searchTerm.value.length < 2) {
        return;
      }

      const searchUrl = getSearchUrl();
      const response = await (await fetch(searchUrl)).json();

      products.value = response.products;
    }

    watch(searchTerm, debounce(performSearch, 600));

    const getSearchUrl = () => {
      const url = "https://dummyjson.com/products/search";
        const params = {
        q: searchTerm.value,
            limit: "5"
      };

      const searchParams = new URLSearchParams(params);
      return `${url}?${searchParams}`;
    };

    const clearSearch = () => {
      searchTerm.value = "";
      products.value = [];
    }

    </script>