For work reasons, I want to start to learn the basics of JavaScript. I have chosen the Javascript authoritative guide (version 6th) as the guide for getting started! I like the brilliant description of the First Triad, JavaScript, HTML, and CSS:
=== Relationship Between Expressions and statements ===
An expression is a phrase of JavaScript that a javascript interpreter can evaluate to produce a value. If the phrases of JavaScript are expressions, then the full sentences are statements. Javascript
Statements are terminated with semicolon. Expressions are evaluated to produce a value, but statements are excuted to make something happen.
=== Closure ===
What is closure?
Closure is one of the important concepts of JavaScript language. If you do not understand this concept, it will affect the learning of jquery plug-in and other concepts. However, for beginners like me, it is difficult to grasp the meaning of the interface at once, especially the definition of the interface in the book, for example: "closure is yet another element from lisp that has migrated into JavaScript. when a function
Is created in Javascript, the function has access to any lexically scoped variables that were in the environment that created it. "From programming HTML5 applications.
Here is a good article
Closures: "A closure is a special kind of object that combines two things: a function, and the environment in which that function was created. the environment consists of any local variables that were in-scope at the time that the closure
Was created ."
In the following example, add5 and add10 are two closure. They represent not only a function, but also an environment. The environment retains the variable that add5 and add10 can access when they are created, such as X. This is why add5 and add10 can still access X after makeadder exits.
<! Doctype HTML> <HTML xmlns = "http://www.w3.org/1999/xhtml"> () {// Makeadder is a factory function makeadder (x) {return function (y) {return x + y ;};}; // add5 is a closure var add5 = makeadder (5); // add10 is another close var add10 = makeadder (10); var list = "<li> call add5 (1) = "+ add5 (1) +" </LI> ";
List + = "<li> call add10 (1) =" + add10 (1) + "</LI> "; $ ("# list" ).html (list );}); </SCRIPT>
=== Anonymous function? ===
Javascript anonymous function.
"Variables are scoped at the function level in Javascript. This is different to what you might be used to in a language like C # or Java where the variables are scoped
The block. What this means is if you declare a variable inside a loop or an if statement, it will be available to the entire function ."
=== What is self-invocation pattern? ===
Self-Invocation
"Self-Invocation (also known as auto-Invocation) is when a function executes immediately upon it's definition. This is a core pattern and serves as the foundation for your other patterns
Of Javascript development ."
"In an effort to protect the global object, all JavaScript applications shocould be written within a self-invoking function. This will create an Application Scope
In which variables can be created without the fear of them colliding with other applications ."
=== JavaScript strict mode ===
'Use strict ': ie10 is supported.
=== ASP. net mvc 4-bundles ===
Bundling and minification (F12, debugging, enableoptimizations), scriptbundle,
Stylebuddle.
Bundles set the HTTP Expires header one year from when the bundle is created. If you navigate to a previusly viewed page, Fiddler shows IE does not make a conditional request for
Bundle, that is, there are no http get requests from IE for the bundles and no HTTP 304 responses from the server. you can force IE to make a conditional request for each bundle with the F5 key (resulting in a HTTP 304 response for each bundle ). you can
Force a full refresh by using ^ F5 (resulting in a HTTP 200 response for each bundle
=== Razor: sitelayout. cshtml, _ viewstart. cshtml @ rendorsection () ====
ASP. net mvc: Layout with razor
"Razor between des a new feature that enables us to remove the need to explicitly set the layout in each view-and instead allows us to define the layout logic once for all views in the site-making our view files even cleaner
And more maintainable (and ensuring we keep to the dry principle: Don't repeat yourself ). "------ DEFINE _ viewstart. cshtml file and place it in the \ views folder to define layout for all views.
=== HTTP 304 === HTTP status code definitions, get
(In generalhttp 304)
Is returned by web server when the browser is not really sure about up-to-date 'ness of the resource)
There are no classes in JavaScript and this allows for great flexibility, because you don't have to know anything about your object in advance; you don't need a class "blueprint ".
=== JSON-JavaScript Object Notation ===
It's only a combination of the array and the object literal notation. the only syntax differenc between JSON and the object literal is that property names need to be wrapped in quotes to be valid JSON. here is a JSON string example: {"name ":
"Jeffrey", "some": [1, 2, 3]}. In JSON strings, you cannot use functions or regular expression literals.JSON. parse ()AndJSON. stringify ()Are
Natively supported by the JavaScript engine in modern browsers, such as IE. jquery has jquery. parsejson but no the opposite operation?
To convert a JSON text into an object, you can useEval ()Function. It invokes the Javascript compiler. Since JSON is a proper subset of JavaScript, the compiler will
Correctly parse the text and produce an object structure. The text must be wrapped in Parens to avoid tripping on an ambiguity in Javascript's syntax.
var myObject = eval('(' + myJSONtext + ')');
The eval function is very fast. However, it can compile and execute any JavaScript program,So there can be security issues. The use of Eval is indicated
When the source is trusted and competent. It is much safer to use a JSON parser
Chainability-understand the chain. IFRAME memory
In IE, lost focus http://blog.csdn.net/liaobc/article/details/7887238JQuery
Blur ()
The Blur event fires when an element loses focus either via the pointing device or by tabbing navigation.
This. Each ()=== Knockout. js ===Jquery supports "chainable methods", which means that most jquery functions shold return this .. each () returns this, and if you want ('selector').yourplugin().css (...) to work, You shoshould return this.
Jquery, as a general JavaScript framework, makes JavaScript programming much easier and more concise. However, it is still difficult to solve some specific problems, such as binding data to UI elements. Knockout. JS is a framework dedicated to binding data to UI elements. It makes the bound code more concise. Beginners
Guide to knockout. JS: Part 1, Part
2 and Part 3 are good beginners. Knockoutjs
Videos combined with ASP. net mvc and MVC
Techniques with jquery, JSON and knockout. js.
One of the advantages of Knockout is that it uses the data-bind attribute to establish the binding relationship between data and interface elements, avoiding directly coupling with DOM elements. Changes to the HTML structure will not affect binding. For example:
<p>The day of the week is <span data-bind="text: dayOfWeek"></span>. It's time for <span data-bind="text: activity"></span></p>
function viewModel() { this.dayOfWeek = ko.observable('Sunday'); this.activity = ko.observable('rest');};ko.applyBindings(new viewModel());
To make good use of knockout, you also need to understand the mvvm mode, understanding
Mvvm-A Guide for javascipdevelopers is a good introduction. The following is an overview:
=== Altjs ===Mvvm (Model View viewmodel) is an elastic tural pattern based on MVC and MVP, which attempts to more clearly separate the development of user-interfaces (UI) from that of thebusiness logic and behaviour in an application.
To this end, implements implementations of this pattern make use of declarative data bindings to allow a separation of work on views from other layers.This facilitates UI and development work occurring almost using within the same codebase. UI developers write bindings to the viewmodel within their document markup (HTML), where the model and viewmodel are maintained by developers
Working on the logic for the application.
There are too many new words in the year and year, so I accidentally quit. Altjs should be a substitute for Javascript. For more information, see coffeescript vs. Typescript vs. Dart .?????? What's wrong with JavaScript ??????
=== Require. js ===
Modular JavaScript with requirejs is mainly used to make up for the Javascript language's support for Modular programming (modular programming. Without requirejs, developers mainly rely on the <SCRIPT> label to define and load a series of required JavaScript files. This method is effective for applications that use a small number of JavaScript files. However, for applications that use a large number of JavaScript files, the maintenance cost and complexity are very large. At the same time, the adoption of <SCRIPT> will also affect the performance. You need to wait until all files are loaded before using the application.
The use of requirejs brings two benefits: 1. Clear module definition; 2. Improved performance of asynchronous module loading;
Requirejs org Doc
The above two articles of requirejs Doc API are suitable for beginners who have been familiar with requirejs. Here, the requirejs documentation is more suitable for developers who need to know the details of requirejs. It gives a more detailed description of all aspects of requirejs, including the use and configuration of APIs. In particular, require ()
Processing of non-module JavaScript files during API loading.
Requirejs/text is a plug-in used to load text content.
Requirejs makes JavaScript code have a better modular structure, but what if I perform a unit test on such code? What if the module's external dependency is blocked? Http://fragphace.pl/blog/2013-03-13-Mocking-requirejs-dependencies is a good entry.
=== Backbone. js ===
Getting started with backbone. js
"Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and
Connects it all to your existing application over a restful JSON interface ."
"Backbone provides a clean way to surgically separate your data from your presentation. The model that works with the data is only concerned with synchronizing with a server while the view's
Primary duty is listening to changes to the subscribed model and rendering the HTML"
=== Knockback ===
Can knockback be used to handle complicated data object, where the object is nested with collections?
Getting started with knockback. js
In essence,
Knockback. js bridges the dynamic Dom bindings ofknockout. js
With the models, computeds, and routers ofbackbone. js. It also brings some other cool features like
Localization, default values, and nested view models!
Tutorial: getting started with knockback.
"You can use knockback to bind backbone models/collections to your HTML/templates (View) using knockout ."
2-way databanding using knockout and backbone
"Knockback is a fantastic little
"Bridge" Library that brings together the MVP structureBackBone and the magical data-binding goodnessKnockOut.
The library doesn't replace either one, but just smoothes over the rough edges where they stomp on each other, allowing you to create a knockout viewmodel from a plain old backbone. model ."
=== Bootstrap ===
How to use Twitter Bootstrap to create
Responsive web design?
"At the core of Bootstrap is a set of basic HTML elements that have been styled to allow for easy enhancement via classes and user styles ."
Get started with MEF
Reference:
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
