回归基础的东西,不能只是“感觉会了”

很多时候,觉得自己掌握的东西还是很少,做事情的效率还不是很高,希望自己能够成长起来,认认真真做事。

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

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
原文地址:https://www.cnblogs.com/oxspirt/p/7997714.html