1. 程式人生 > >回歸基礎的東西,不能只是“感覺會了”

回歸基礎的東西,不能只是“感覺會了”

sel attr name dont link after desc round tput

很多時候,覺得自己掌握的東西還是很少,做事情的效率還不是很高,希望自己能夠成長起來,認認真真做事。

--------------------------------------------------------------------------------------------------------------------------------------------

Javascript聲明變量的時候,雖然用var關鍵字聲明和不用關鍵字聲明,很多時候運行並沒有問題,但是這兩種方式還是有區別的。可以正常運行的代碼並不代表是合適的代碼。

var num = 1;

是在當前域中聲明變量. 如果在方法中聲明,則為局部變量(local variable);如果是在全局域中聲明,則為全局變量。

而 num = 1;

事實上是對屬性賦值操作。首先,它會嘗試在當前作用域鏈(如在方法中聲明,則當前作用域鏈代表全局作用域和方法局部作用域etc。。。)中解析 num; 如果在任何當前作用域鏈中找到num,則會執行對num屬性賦值; 如果沒有找到num,它才會在全局對象(即當前作用域鏈的最頂層對象,如window對象)中創造num屬性並賦值。

註意!它並不是聲明了一個全局變量,而是創建了一個全局對象的屬性。

即便如此,可能你還是很難明白“變量聲明”跟“創建對象屬性”在這裏的區別。事實上,Javascript的變量聲明、創建屬性以及每個Javascript中的每個屬性都有一定的標誌說明它們的屬性----如只讀(ReadOnly)不可枚舉(DontEnum)不可刪除(DontDelete)等等。

由於變量聲明自帶不可刪除屬性,比較var num = 1 跟 num = 1,前者是變量聲明,帶不可刪除屬性,因此無法被刪除;後者為全局變量的一個屬性,因此可以從全局變量中刪除。

具體見以下代碼:

復制代碼代碼如下:
// num1為全局變量,num2為window的一個屬性

var num1 = 1;

num2 = 2;

// delete num1; 無法刪除

// delete num2; 刪除

function model(){

var num1 = 1; // 本地變量

num2 = 2; // window的屬性

// 匿名函數

(function(){

var num = 1; // 本地變量

num1 = 2; // 繼承作用域(閉包)

num3 = 3; // window的屬性

}())

}

PS. 在ECMAScript5標準中,有一種“嚴格模式”(Strict Mode)。在嚴格模式中,為未聲明的標識符賦值將會拋引用錯誤,因此可以防止意外的全局變量屬性的創造。目前一些瀏覽器的新版本已經支持。

-----------------------------------------------------------------------------------------------------------------------------------------------

下面收集一些基礎的知識,有時候基礎的東西不能忘記,這些都是我們今天得以站立的根基和基石。

The HTML DOM Document Object

HTML DOM Nodes

In the HTML DOM (Document Object Model), everything is a node:

  • The document itself is a document node
  • All HTML elements are element nodes
  • All HTML attributes are attribute nodes
  • Text inside HTML elements are text nodes
  • Comments are comment nodes

The Document Object

When an HTML document is loaded into a web browser, it becomes a document object.

The document object is the root node of the HTML document and the "owner" of all other nodes:
(element nodes, text nodes, attribute nodes, and comment nodes).

The document object provides properties and methods to access all node objects, from within JavaScript.

Tip: The document is a part of the Window object and can be accessed as window.document.

Document Object Properties and Methods

The following properties and methods can be used on HTML documents:

Property / MethodDescription
document.activeElement Returns the currently focused element in the document
document.addEventListener() Attaches an event handler to the document
document.adoptNode() Adopts a node from another document
document.anchors Returns a collection of all <a> elements in the document that have a name attribute
document.applets Returns a collection of all <applet> elements in the document
document.baseURI Returns the absolute base URI of a document
document.body Sets or returns the document‘s body (the <body> element)
document.close() Closes the output stream previously opened with document.open()
document.cookie Returns all name/value pairs of cookies in the document
document.charset Deprecated. Use document.characterSet instead. Returns the character encoding for the document
document.characterSet Returns the character encoding for the document
document.createAttribute() Creates an attribute node
document.createComment() Creates a Comment node with the specified text
document.createDocumentFragment() Creates an empty DocumentFragment node
document.createElement() Creates an Element node
document.createTextNode() Creates a Text node
document.doctype Returns the Document Type Declaration associated with the document
document.documentElement Returns the Document Element of the document (the <html> element)
document.documentMode Returns the mode used by the browser to render the document
document.documentURI Sets or returns the location of the document
document.domain Returns the domain name of the server that loaded the document
document.domConfig Obsolete. Returns the DOM configuration of the document
document.embeds Returns a collection of all <embed> elements the document
document.forms Returns a collection of all <form> elements in the document
document.getElementById() Returns the element that has the ID attribute with the specified value
document.getElementsByClassName() Returns a NodeList containing all elements with the specified class name
document.getElementsByName() Returns a NodeList containing all elements with a specified name
document.getElementsByTagName() Returns a NodeList containing all elements with the specified tag name
document.hasFocus() Returns a Boolean value indicating whether the document has focus
document.head Returns the <head> element of the document
document.images Returns a collection of all <img> elements in the document
document.implementation Returns the DOMImplementation object that handles this document
document.importNode() Imports a node from another document
document.inputEncoding Returns the encoding, character set, used for the document
document.lastModified Returns the date and time the document was last modified
document.links Returns a collection of all <a> and <area> elements in the document that have a href attribute
document.normalize() Removes empty Text nodes, and joins adjacent nodes
document.normalizeDocument() Removes empty Text nodes, and joins adjacent nodes
document.open() Opens an HTML output stream to collect output from document.write()
document.querySelector() Returns the first element that matches a specified CSS selector(s) in the document
document.querySelectorAll() Returns a static NodeList containing all elements that matches a specified CSS selector(s) in the document
document.readyState Returns the (loading) status of the document
document.referrer Returns the URL of the document that loaded the current document
document.removeEventListener() Removes an event handler from the document (that has been attached with the addEventListener() method)
document.renameNode() Renames the specified node
document.scripts Returns a collection of <script> elements in the document
document.strictErrorChecking Sets or returns whether error-checking is enforced or not
document.title Sets or returns the title of the document
document.URL Returns the full URL of the HTML document
document.write() Writes HTML expressions or JavaScript code to a document
document.writeln() Same as write(), but adds a newline character after each statement

回歸基礎的東西,不能只是“感覺會了”