Javascript函数顺序执行和良好实践？

Question

为什么这项工作

$("#tag-search").autocomplete({
        autoFocus: true,
        source: tags,
        messages: {
            noResult: '',
            results: function () {}
        },
        select: function (e, ui) {
            $('.tags').append('<span class="tag-style">' + ui.item.value + '<i class="fa fa-times tag-del" aria-hidden="true"></i></span>');
            ui.item.value = "";
            $('.tag-del').click(function () {
                $(this).parent().remove();
            });
        }
    });

这不是吗？

$("#tag-search").autocomplete({
        autoFocus: true,
        source: tags,
        messages: {
            noResult: '',
            results: function () {}
        },
        select: function (e, ui) {
            $('.tags').append('<span class="tag-style">' + ui.item.value + '<i class="fa fa-times tag-del" aria-hidden="true"></i></span>');
            ui.item.value = "";
        }
    });

    $('.tag-del').click(function () {
        $(this).parent().remove();
    });

我从未理解如何编译javascript以及如何工作！有人可以帮帮我吗？ 最后一件事：最好在正文页面或外部文件中编写javascript？如果我应该写在外部文件中如何发送php响应javascript文件？谢谢！