Rumah hujung hadapan web tutorial js 悟透JavaScript整理版第1/2页_javascript技巧

悟透JavaScript整理版第1/2页_javascript技巧

May 16, 2016 pm 07:05 PM
javascript belajar

编程世界里只存在两种基本元素,一个是数据,一个是代码。编程世界就是在数据和代码千丝万缕的纠缠中呈现出无限的生机和活力。

数据天生就是文静的,总想保持自己固有的本色;而代码却天生活泼,总想改变这个世界。

   你看,数据代码间的关系与物质能量间的关系有着惊人的相似。数据也是有惯性的,如果没有代码来施加外力,她总保持自己原来的状态。而代码就象能量,他存在的唯一目的,就是要努力改变数据原来的状态。在代码改变数据的同时,也会因为数据的抗拒而反过来影响或改变代码原有的趋势。甚至在某些情况下,数据可以转变为代码,而代码却又有可能被转变为数据,或许还存在一个类似E=MC2形式的数码转换方程呢。然而,就是在数据和代码间这种即矛盾又统一的运转中,总能体现出计算机世界的规律,这些规律正是我们编写的程序逻辑。

    不过,由于不同程序员有着不同的世界观,这些数据和代码看起来也就不尽相同。于是,不同世界观的程序员们运用各自的方法论,推动着编程世界的进化和发展。

    众所周知,当今最流行的编程思想莫过于面向对象编程的思想。为什么面向对象的思想能迅速风靡编程世界呢?因为面向对象的思想首次把数据和代码结合成统一体,并以一个简单的对象概念呈现给编程者。这一下子就将原来那些杂乱的算法与子程序,以及纠缠不清的复杂数据结构,划分成清晰而有序的对象结构,从而理清了数据与代码在我们心中那团乱麻般的结。我们又可以有一个更清晰的思维,在另一个思想高度上去探索更加浩瀚的编程世界了。

    在五祖弘忍讲授完《对象真经》之后的一天,他对众弟子们说:“经已讲完,想必尔等应该有所感悟,请各自写个偈子来看”。大弟子神秀是被大家公认为悟性最高的师兄,他的偈子写道:“身是对象树,心如类般明。朝朝勤拂拭,莫让惹尘埃!”。此偈一出,立即引起师兄弟们的轰动,大家都说写得太好了。只有火头僧慧能看后,轻轻地叹了口气,又随手在墙上写道:“对象本无根,类型亦无形。本来无一物,何处惹尘埃?”。然后摇了摇头,扬长而去。大家看了慧能的偈子都说:“写的什么乱七八糟的啊,看不懂”。师父弘忍看了神秀的诗偈也点头称赞,再看慧能的诗偈之后默然摇头。就在当天夜里,弘忍却悄悄把慧能叫到自己的禅房,将珍藏多年的软件真经传授于他,然后让他趁着月色连夜逃走...

    后来,慧能果然不负师父厚望,在南方开创了禅宗另一个广阔的天空。而慧能当年带走的软件真经中就有一本是《JavaScript真经》!

回归简单

    要理解JavaScript,你得首先放下对象和类的概念,回到数据和代码的本原。前面说过,编程世界只有数据和代码两种基本元素,而这两种元素又有着纠缠不清的关系。JavaScript就是把数据和代码都简化到最原始的程度。

    JavaScript中的数据很简洁的。简单数据只有 undefined, null, boolean, number和string这五种,而复杂数据只有一种,即object。这就好比中国古典的朴素唯物思想,把世界最基本的元素归为金木水火土,其他复杂的物质都是由这五种基本元素组成。

    JavaScript中的代码只体现为一种形式,就是function。

    注意:以上单词都是小写的,不要和Number, String, Object, Function等JavaScript内置函数混淆了。要知道,JavaScript语言是区分大小写的呀!

    任何一个JavaScript的标识、常量、变量和参数都只是unfined, null, bool, number, string, object 和 function类型中的一种,也就typeof返回值表明的类型。除此之外没有其他类型了。

    先说说简单数据类型吧。

    undefined:   代表一切未知的事物,啥都没有,无法想象,代码也就更无法去处理了。
                      注意:typeof(undefined) 返回也是 undefined。
                              可以将undefined赋值给任何变量或属性,但并不意味了清除了该变量,反而会因此多了一个属性。

    null:            有那么一个概念,但没有东西。无中似有,有中还无。虽难以想象,但已经可以用代码来处理了。
                      注意:typeof(null)返回object,但null并非object,具有null值的变量也并非object。

    boolean:      是就是,非就非,没有疑义。对就对,错就错,绝对明确。既能被代码处理,也可以控制代码的流程。

    number:      线性的事物,大小和次序分明,多而不乱。便于代码进行批量处理,也控制代码的迭代和循环等。
                      注意:typeof(NaN)和typeof(Infinity)都返回number 。
                              NaN参与任何数值计算的结构都是NaN,而且 NaN != NaN 。
                              Infinity / Infinity = NaN 。

    string:         面向人类的理性事物,而不是机器信号。人机信息沟通,代码据此理解人的意图等等,都靠它了。

     简单类型都不是对象,JavaScript没有将对象化的能力赋予这些简单类型。直接被赋予简单类型常量值的标识符、变量和参数都不是一个对象。

    所谓“对象化”,就是可以将数据和代码组织成复杂结构的能力。JavaScript中只有object类型和function类型提供了对象化的能力。

没有类

    object就是对象的类型。在JavaScript中不管多么复杂的数据和代码,都可以组织成object形式的对象。

    但JavaScript却没有 “类”的概念!

    对于许多面向对象的程序员来说,这恐怕是JavaScript中最难以理解的地方。是啊,几乎任何讲面向对象的书中,第一个要讲的就是“类”的概念,这可是面向对象的支柱。这突然没有了“类”,我们就象一下子没了精神支柱,感到六神无主。看来,要放下对象和类,达到“对象本无根,类型亦无形”的境界确实是件不容易的事情啊。

    这样,我们先来看一段JavaScript程序: 
    


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]


这段JavaScript程序一开始产生了一个生命对象life,life诞生时只是一个光溜溜的对象,没有任何属性和方法。在第一次生命过程中,它有了一个身体属性body,并有了一个say方法,看起来是一个“卵细胞”。在第二次生命过程中,它又长出了“尾巴”和“腮”,有了tail和gill属性,显然它是一个“蝌蚪”。在第三次生命过程中,它的tail和gill属性消失了,但又长出了“四条腿”和“肺”,有了legs和lung属性,从而最终变成了“青蛙”。如果,你的想像力丰富的话,或许还能让它变成英俊的“王子”,娶个美丽的“公主”什么的。不过,在看完这段程序之后,请你思考一个问题:

    我们一定需要类吗?

    还记得儿时那个“小蝌蚪找妈妈”的童话吗?也许就在昨天晚,你的孩子刚好是在这个美丽的童话中进入梦乡的吧。可爱的小蝌蚪也就是在其自身类型不断演化过程中,逐渐变成了和妈妈一样的“类”,从而找到了自己的妈妈。这个童话故事中蕴含的编程哲理就是:对象的“类”是从无到有,又不断演化,最终又消失于无形之中的...

    “类”,的确可以帮助我们理解复杂的现实世界,这纷乱的现实世界也的确需要进行分类。但如果我们的思想被“类”束缚住了,“类”也就变成了“累”。想象一下,如果一个生命对象开始的时就被规定了固定的“类”,那么它还能演化吗?蝌蚪还能变成青蛙吗?还可以给孩子们讲小蝌蚪找妈妈的故事吗?

    所以,JavaScript中没有“类”,类已化于无形,与对象融为一体。正是由于放下了“类”这个概念,JavaScript的对象才有了其他编程语言所没有的活力。

    如果,此时你的内心深处开始有所感悟,那么你已经逐渐开始理解JavaScript的禅机了。

函数的魔力

    接下来,我们再讨论一下JavaScript函数的魔力吧。

    JavaScript的代码就只有function一种形式,function就是函数的类型。也许其他编程语言还有procedure或 method等代码概念,但在JavaScript里只有function一种形式。当我们写下一个函数的时候,只不过是建立了一个function类型的实体而已。请看下面的程序: 


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]


  这个代码运行之后可以看到typeof(myfunc)返回的是function。以上的函数写法我们称之为“定义式”的,如果我们将其改写成下面的“变量式”的,就更容易理解了: 


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]


    这里明确定义了一个变量myfunc,它的初始值被赋予了一个function的实体。因此,typeof(myfunc)返回的也是function。其实,这两种函数的写法是等价的,除了一点细微差别,其内部实现完全相同。也就是说,我们写的这些JavaScript函数只是一个命了名的变量而已,其变量类型即为function,变量的值就是我们编写的函数代码体。

    聪明的你或许立即会进一步的追问:既然函数只是变量,那么变量就可以被随意赋值并用到任意地方啰?

    我们来看看下面的代码: 


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]


    这个程序运行的结果告诉我们:答案是肯定的!在第一次调用函数之后,函数变量又被赋予了新的函数代码体,使得第二次调用该函数时,出现了不同的输出。

    好了,我们又来把上面的代码改成第一种定义式的函数形式: 


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]


    按理说,两个签名完全相同的函数,在其他编程语言中应该是非法的。但在JavaScript中,这没错。不过,程序运行之后却发现一个奇怪的现象:两次调用都只是最后那个函数里输出的值!显然第一个函数没有起到任何作用。这又是为什么呢?

    原来,JavaScript执行引擎并非一行一行地分析和执行程序,而是一段一段地分析执行的。而且,在同一段程序的分析执行中,定义式的函数语句会被提取出来优先执行。函数定义执行完之后,才会按顺序执行其他语句代码。也就是说,在第一次调用myfunc之前,第一个函数语句定义的代码逻辑,已被第二个函数定义语句覆盖了。所以,两次都调用都是执行最后一个函数逻辑了。

    如果把这个JavaScript代码分成两段,例如将它们写在一个html中,并用

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Belajar untuk menyahpasang pip sepenuhnya dan menggunakan Python dengan lebih cekap Belajar untuk menyahpasang pip sepenuhnya dan menggunakan Python dengan lebih cekap Jan 16, 2024 am 09:01 AM

Tidak perlu lagi pip? Datang dan pelajari cara menyahpasang pip dengan berkesan! Pengenalan: pip ialah salah satu alat pengurusan pakej Python, yang boleh memasang, menaik taraf dan menyahpasang pakej Python dengan mudah. Walau bagaimanapun, kadangkala kita mungkin perlu menyahpasang pip, mungkin kerana kita ingin menggunakan alat pengurusan pakej yang lain, atau kerana kita perlu mengosongkan sepenuhnya persekitaran Python. Artikel ini akan menerangkan cara menyahpasang pip dengan cekap dan memberikan contoh kod khusus. 1. Kaedah menyahpasang pip Berikut akan memperkenalkan dua kaedah biasa untuk menyahpasang pip.

Penyelaman mendalam ke dalam peta warna matplotlib Penyelaman mendalam ke dalam peta warna matplotlib Jan 09, 2024 pm 03:51 PM

Untuk mengetahui lebih lanjut tentang jadual warna matplotlib, anda memerlukan contoh kod khusus 1. Pengenalan matplotlib ialah perpustakaan lukisan Python yang berkuasa Ia menyediakan set fungsi dan alatan lukisan yang kaya yang boleh digunakan untuk mencipta pelbagai jenis carta. Peta warna (peta warna) ialah konsep penting dalam matplotlib, yang menentukan skema warna carta. Kajian mendalam tentang jadual warna matplotlib akan membantu kami menguasai fungsi lukisan matplotlib dengan lebih baik dan menjadikan lukisan lebih mudah.

Mendedahkan daya tarikan bahasa C: Mendedahkan potensi pengaturcara Mendedahkan daya tarikan bahasa C: Mendedahkan potensi pengaturcara Feb 24, 2024 pm 11:21 PM

Pesona Pembelajaran Bahasa C: Membuka Potensi Pengaturcara Dengan perkembangan teknologi yang berterusan, pengaturcaraan komputer telah menjadi satu bidang yang telah menarik perhatian ramai. Di antara banyak bahasa pengaturcaraan, bahasa C sentiasa digemari oleh pengaturcara. Kesederhanaan, kecekapan dan aplikasinya yang luas menjadikan pembelajaran bahasa C sebagai langkah pertama untuk ramai orang memasuki bidang pengaturcaraan. Artikel ini akan membincangkan daya tarikan mempelajari bahasa C dan cara membuka kunci potensi pengaturcara dengan mempelajari bahasa C. Pertama sekali, daya tarikan mempelajari bahasa C terletak pada kesederhanaannya. Berbanding dengan bahasa pengaturcaraan lain, bahasa C

Bermula dengan Pygame: Tutorial Pemasangan dan Konfigurasi Komprehensif Bermula dengan Pygame: Tutorial Pemasangan dan Konfigurasi Komprehensif Feb 19, 2024 pm 10:10 PM

Pelajari Pygame dari awal: tutorial pemasangan dan konfigurasi lengkap, contoh kod khusus diperlukan Pengenalan: Pygame ialah perpustakaan pembangunan permainan sumber terbuka yang dibangunkan menggunakan bahasa pengaturcaraan Python Ia menyediakan pelbagai fungsi dan alatan, membolehkan pembangun mencipta pelbagai jenis dengan mudah permainan. Artikel ini akan membantu anda mempelajari Pygame dari awal, dan menyediakan tutorial pemasangan dan konfigurasi yang lengkap, serta contoh kod khusus untuk membolehkan anda bermula dengan cepat. Bahagian Pertama: Memasang Python dan Pygame Pertama, pastikan anda mempunyai

Mari belajar cara memasukkan nombor akar dalam Word bersama-sama Mari belajar cara memasukkan nombor akar dalam Word bersama-sama Mar 19, 2024 pm 08:52 PM

Semasa mengedit kandungan teks dalam Word, anda kadangkala perlu memasukkan simbol formula. Sesetengah lelaki tidak tahu cara memasukkan nombor akar dalam Word, jadi Xiaomian meminta saya untuk berkongsi dengan rakan saya tutorial tentang cara memasukkan nombor akar dalam Word. Semoga membantu kawan-kawan. Mula-mula, buka perisian Word pada komputer anda, kemudian buka fail yang ingin anda edit, dan gerakkan kursor ke lokasi yang anda perlukan untuk memasukkan tanda akar, rujuk contoh gambar di bawah. 2. Pilih [Sisipkan], dan kemudian pilih [Formula] dalam simbol. Seperti yang ditunjukkan dalam bulatan merah dalam gambar di bawah: 3. Kemudian pilih [Insert New Formula] di bawah. Seperti yang ditunjukkan dalam bulatan merah dalam gambar di bawah: 4. Pilih [Radical], dan kemudian pilih radikal yang sesuai. Seperti yang ditunjukkan dalam bulatan merah dalam gambar di bawah:

Tutorial JavaScript Mudah: Cara Mendapatkan Kod Status HTTP Tutorial JavaScript Mudah: Cara Mendapatkan Kod Status HTTP Jan 05, 2024 pm 06:08 PM

Tutorial JavaScript: Bagaimana untuk mendapatkan kod status HTTP, contoh kod khusus diperlukan: Dalam pembangunan web, interaksi data dengan pelayan sering terlibat. Apabila berkomunikasi dengan pelayan, kami selalunya perlu mendapatkan kod status HTTP yang dikembalikan untuk menentukan sama ada operasi itu berjaya dan melaksanakan pemprosesan yang sepadan berdasarkan kod status yang berbeza. Artikel ini akan mengajar anda cara menggunakan JavaScript untuk mendapatkan kod status HTTP dan menyediakan beberapa contoh kod praktikal. Menggunakan XMLHttpRequest

Ketahui fungsi utama dalam bahasa Go dari awal Ketahui fungsi utama dalam bahasa Go dari awal Mar 27, 2024 pm 05:03 PM

Tajuk: Pelajari fungsi utama dalam bahasa Go dari awal Sebagai bahasa pengaturcaraan yang mudah dan cekap, bahasa Go digemari oleh pembangun. Dalam bahasa Go, fungsi utama ialah fungsi masuk, dan setiap program Go mesti mengandungi fungsi utama sebagai titik masuk program. Artikel ini akan memperkenalkan cara mempelajari fungsi utama dalam bahasa Go dari awal dan memberikan contoh kod khusus. 1. Pertama, kita perlu memasang persekitaran pembangunan bahasa Go. Anda boleh pergi ke laman web rasmi (https://golang.org

Cepat belajar pemasangan pip dan kuasai kemahiran dari awal Cepat belajar pemasangan pip dan kuasai kemahiran dari awal Jan 16, 2024 am 10:30 AM

Pelajari pemasangan pip dari awal dan kuasai kemahiran dengan cepat Contoh kod khusus diperlukan: pip ialah alat pengurusan pakej Python yang boleh memasang, meningkatkan dan mengurus pakej Python dengan mudah. Bagi pembangun Python, adalah sangat penting untuk menguasai kemahiran menggunakan pip. Artikel ini akan memperkenalkan kaedah pemasangan pip dari awal, dan memberikan beberapa petua praktikal dan contoh kod khusus untuk membantu pembaca menguasai penggunaan pip dengan cepat. 1. Pasang pip Sebelum menggunakan pip, anda perlu memasang pip terlebih dahulu. pip

See all articles