How to make my application read codes line by line or wait until execute some lines in ionic

Ionic Framework ionic-v3
1

Hello guys

When I run my application, the codes didn’t execute the lines of my code line by line

For example:
in the first lines of function I defined some variables
in the end of function there is an alert to show the results of these variables.

So when I run the application, I don’t know why my application execute the alert without the variables !

Is there any solution that make application execute the codes line by line or wait the definition of variables ?

2

You will need to understand the difference between synchronous and asynchronous behaviour, I have a video on that for Ionic which may help: https://www.youtube.com/watch?v=vrjsQDZuhLk

What you are describing is synchronous code, lines will execute one after the other. Some code executes asynchronously, like calls to a server or fetching something from storage, and it will be run at some point after the rest of your synchronous code has run. You definitely do not want to force everything to happen synchronously in your application, you just need to understand what asynchronous code is and then how to handle that in your application.

2 Likes
3

I don’t know why the problem still doesn’t solved

You can see my code here, I don’t know why it’s start from get???

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Storage } from '@ionic/storage';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  constructor(public nav: NavController, public storage: Storage) {

  }
  function(){
    this.set();
    this.get();
  }

  set(){
    this.storage.set('name', 'max');
  }

  get(){
    this.storage.get('name').then((val) => {
      alert(val);
    });
  }
}
4

Perhaps

this.storage.set

run in a secound thread and the main thread is faster then this secound thread.

Just a Suggestion.

5

Same problem,
So still I don’t know how I can fix this problem, I checked all what I know and put the set function in several places but still the application start with get function :frowning_with_open_mouth:

6

It is asynchronous code. You work around its schedule, not your schedule.

Therefore, you must wait until the code is guaranteed to be finished. Which is the good news! It will eventually let you know that it is done, and safe to continue doing stuff. In particular, this.storage.set returns a Promise, which is a type of future, which for our discussion merely means that it will execute its code, and it will return at some point in the future. Perhaps it will be 5 seconds from now, but maybe it’ll be a minute or two. However, it will finish and let you know…it promises!

With all that in mind, your example code will need to look something like this:

  initialize(){
    this.set().then(_ => {
        this.get();
    });
  }

  set(){
    return this.storage.set('name', 'max');
  }

  get(){
    return this.storage.get('name').then((val) => {
      alert(val);
    });
  }
1 Like
7

yes, that what I was want to understand it … thank u so much :slight_smile:

8

There’s no second thread, only one thread. There’s no multithreading in javascript.

It’s in the message queue and it will be processed by the same thread when it’s done with the current code and the preceding messages in the queue.

9

That is right. Thread was the wrong word. The effect is the same.

The code proceed before some promise is resolved.